@ued2345/stylelint-config v0.2.3

stylelint-config

CSS 编码规范之 Stylelint 配置文件 ‧ UED2345

安装

在你的项目中安装 Stylelint 和本项目的 npm 包（以下简称 “本包”）：

npm i -D stylelint
npm i -D @ued2345/stylelint-config

使用方法

1. 在你的项目的根目录添加 .stylelintrc.js 文件：

   module.exports = {
   	extends: [
   		'@ued2345/stylelint-config',
   	],
   }

   • 在 extends 字段指定预设的配置包，各配置包的具体含义参见下面的 “配置包” 段落。

   • 如果你的项目需要禁用或覆盖配置包中的某条规则，可以添加 rules 字段并写入你自己的规则配置：

     	```js
     		rules: {
     			'block-no-empty': null,     // 禁用某条规则
     			'color-hex-case': 'lower',  // 覆盖某条规则
     		},
     	```

   • 如果你需要把特定文件排除在校验范围之外，可添加 ignoreFiles 字段：

     	```js
     		ignoreFiles: [
     			'./src/vendor/**/*.*',
     		],
     	```

2. 在你的项目的 package.json 文件中添加脚本：

   {
     "scripts": {
       "lint-css": "stylelint src/**/*.scss src/**/*.vue"
     }
   }

3. 执行以下命令开始校验 CSS 代码：

   npm run lint-css

   如果需要 Stylelint 帮忙修复，执行以下命令：（注意：只有部分问题可以自动修复）

   npm run lint-css -- --fix

   如有必要，你可以把上述命令整合到 CI、Git hook 等工作流中。

规则

• 本包的所有规则配置

• 附：Stylelint 规则官方文档
• 附：Stylelint 官方推荐的规则集（核心规则）
• 附：Stylelint 官方推荐的规则集（含代码风格）

配置包

本包包含了多个预设的配置包，可以搭配使用。它们的含义分别如下：

我们可以在 .stylelintrc.js 文件的 extends 字段同时指定多个配置包：

	extends: [
		'@ued2345/stylelint-config/preset/essential',
		'@ued2345/stylelint-config/preset/recommended',
	],