Vue项目模板 - Css规范

前言

关于项目css规范有很多，css选择器、css命名、css预处理（less）、组件库等。

本项目：

执行命令：

npm install -g less

vue3.0安装了less，可以直接在style标签添加lang='less'，即可使用。

代码：

页面：

安装命令：

npm install element-plus --save

package.json文件

main.ts文件

HelloWorid.vue

页面

本次安装：stylelint-config-recommended和## stylelint-config-standard，没有安装stylelint。

执行命令：

npm install stylelint-config-recommended stylelint-config-standard

根目录创建stylelint.config.js文件

vscode安装插件stylelint和Prettier-Code formatter，vscode文件settings.json设置

[less]是要开启自动检测的css预处理语言。本项目使用的是less，如果使用sass，则改为[sass]。

实现自动检测，将stylelint.config.js中的rule复制到vscode 的settings.json的stylelint.config内

保存即可自动修复

package.json文件