认识
2023年02月22日
提示
一、认识
StyleLint 是一个强大的，现代的代码检查工具，与ESLint类似，StyleLint能够通过定义一系列的编码风格规则帮助我们避免在样式表中出现错误。目前在开源社区上，关于 CSS Lint 的解决方案主要包括了 CssLint、SCSS-Lint和StyleLint等几种。而由于StyleLint在技术架构上基于AST的方式扩展CSS，除原生CSS语法，其也支持 SCSS、Less 这类预处理器，并且也有非常多的第三方插
二、安装
2.1 安装 StyleLint
stylelint-config-standard是StyleLint的标准配置。如果想使用airbnb或prettier的规范，也可以将stylelint-config-standard改为stylelint-config-airbnb或stylelint-config-prettier。
npm install stylelint stylelint-config-standard --save-dev
2.3 安装CSS属性排序插件
我们也可以选择安装stylelint-order插件。该插件能够强制我们按照某个顺序编写css，比如先写定位，再写盒模型，再写内容区样式，最后写CSS3相关属性，这样可以更好的保证我们代码的可读性。
npm install stylelint-order --save-dev
2.2 安装适配预处理语法的插件
如果我们项目中采用了如sass或less等css预处理器，那么可以安装适配预处理语法的插件。以sass为例，需要安装stylelint-scss插件。
npm install stylelint-scss --save-dev