可以不用安装 Stylelint

npm install --save-dev --save-exact prettier

如果没有请安装：

npm install --save-dev typescript-eslint eslint-plugin-vue

安装好后在 eslint.config.mjs配置如下：

// eslint.config.mjsimportpluginJs from"@eslint/js";importtseslint from"typescript-eslint";importpluginVue from"eslint-plugin-vue";/** @type {import('eslint').Linter.Config[]} */exportdefault[// @eslint/js 扩展插件pluginJs.configs.recommended,// typescript-eslint 扩展插件...tseslint.configs.recommended,// eslint-plugin-vue 扩展插件...pluginVue.configs["flat/essential"],// eslint-plugin-vue 配置对象属性{files:["**/*.vue"],languageOptions:{parserOptions:{parser:tseslint.parser}}},];

4. 安装非必要的ESlint 扩展插件

扩展插件说明：

• eslint-plugin-import-x： 这是 eslint-plugin-import 插件的升级版，对模块化的 js 文件能够标记出模块语法中的问题，且防止文件路径和导入名称拼写错误的问题，还可以优化 import 导包顺序。
• 引入 lint-staged，配合 husky使用可以在提交代码前，对 git add/update 到在暂存区的文件，运行代码检查和格式化。所以为了解决这个问题需要和 lint-staged搭配使用。不过配置已经简化了很多很多，后面会讲到需要注意到地方。

  建议 ignores单独一个对象变成全局忽略，只含有一个 ignores属性，这样 Eslint 会将这个全局忽略数组自动添加到 ["**/node_modules/", ".git/"]的后面。官方改成了只能在 eslint.config.js配置文件里配置了。

  七、

  

  在 settings.json文件里添加如下内容：

  {"explorer.fileNesting.enabled":true,"explorer.fileNesting.expand":false,"explorer.fileNesting.patterns":{"eslint.config.mjs":"prettier.config.mjs, .prettierignore, stylelint.config.mjs, .stylelintignore"}}

  ---

  结尾

  全部配置好后，就可以愉快的使用项目了。

• ignores：一个 glob 模式数组，指示配置对象不应应用到的文件。可参考配置文件 - 级联配置对象，配置文件 - 配置规则，配置文件 - 组合配置。

  

  接着添加以下内容：

  {"editor.formatOnPaste":false,// 保存时执行格式化"editor.formatOnSave":true,// 保存时指定插件操作"editor.codeActionsOnSave":{"source.fixAll":"never","source.fixAll.eslint":"explicit","source.fixAll.stylelint":"explicit"},// 设置默认用prettier插件进行代码格式化"editor.defaultFormatter":"esbenp.prettier-vscode",// stylelint 校验的文件格式"stylelint.validate":["css","less","postcss","scss","vue","sass","vue","html"]}

  设置好后，在任意文件里按 Ctrl + S保存，即可自动执行格式化操作了。

  前言

  之前一直在用 vue项目脚手架，使用 npm create vue@latest创建的vue.js项目，里面已经集成了代码规范与格式化的插件，完全够用，也不需要我们自己动手（大大的赞，想起以前痛苦的配置经历），已经很久没有配置代码规范了。推荐配置如下：

  // prettier.config.mjs/** * @see https://prettier.io/docs/en/configuration.html * @type {import("prettier").Config} */constconfig ={// 不尾随分号semi:false,// 使用单引号singleQuote:true,// 多行逗号分割的语法中，最后一行不加逗号trailingComma:'none',// 行尾风格，设置为autoendOfLine:'auto',// 一行最多 100 字符printWidth:120,// 使用 2 个空格缩进tabWidth:2,// 不使用缩进符，而使用空格useTabs:false,// 单个参数的箭头函数不加括号 x => xarrowParens:'avoid',// 对象大括号内两边是否加空格 { a:0 }bracketSpacing:true}exportdefaultconfig

  3. 创建 .prettierignore 文件

  这里复制了 .gitignore文件的内容，并在末尾添加想要忽略的文件。例如：禁止使用导出名称作为默认导出的属性，确保所有导出都出现在其他语句之后等。

  1. 符合能与 a.ts文件匹配上的有配置对象1，配置对象2，配置对象5，所以依次按1，2，5合并，同属性后面覆盖前面，最终 'import-x/no-named-as-default-member': 'error'。

     1. 安装 Stylelint

     npm init stylelint

     安装 stylelint的同时，会附带安装 stylelint-config-standard。

     八、

     4. 在 pre-commit文件中添加 lint-staged

     覆盖粘贴以下内容：

     # pre-commit#!/usr/bin/env sh. "$(dirname -- "$0")/_/husky.sh"# Run the pre-commit hooknpx --no-install -- lint-staged

     5. 测试 Husky

     想要成功执行 lint-staged + Husky 插件，需要先将项目变成 git 项目。

     对 a.ts文件执行 npx eslint a.ts时，ESlint 对 eslint.config.mjs中的数组依次开始执行，对每个配置对象的files和 ignores与 a.ts文件匹配。^20.9.0或 >=21.1.0）注意不支持 v19；

  2. 新的默认配置格式 (eslint.config.js)，旧版格式 eslintrc 已弃用；
  3. 使用扁平化配置文件，不支持旧版写法了，可能需要你去官网了解一下。注意这个插件仅关闭规则，需要搭配下面的 eslint-plugin-prettier 来使用。
  4. eslint-plugin-prettier： 将 Prettier 作为 ESlint 的扩展插件，成为 ESlint 语法检查规则的扩展部分。

     对于我的理解是，类似于 Object.assign()的合并规则。

  5. 引入 Husky，git 的钩子，可以增强 git 功能，在提交或推送时自动检查提交的消息、

     2. 创建 prettier.config.mjs 文件

     安装完成后会自动创建一个 .stylelintrc.json配置文件，我推荐把名字改成 prettier.config.mjs与 ESlint 命名风格相同，并且还可以提供代码提示，修改配置如下：

     // prettier.config.mjs/** @type {import('stylelint').Config} */exportdefault{extends:['stylelint-config-standard']}

     3. 创建 .stylelintignore 文件

     创建 .stylelintignore文件，并添加想要忽略的文件：

     node_modulessrc/uni_modules/src/static/dist/**/*.svg

     4. 安装必要的 Stylelint 插件

     扩展插件说明：

     • stylelint-config-standard： Stylelint 社区推荐的标准可共享规则，规范会比较严格。有规则规范更宽松的 stylelint-config-recommended-scss，安装二选一；
     • stylelint-config-standard-vue： 针对 vue 文件扩展解析和规则，解决例如 vue 插值语法产生的 Unknown word (CssSyntaxError)错误。

       仅对 vscode 编辑器优化代的插件，可以实现按 Ctrl + S保存的时候对当前文件自动执行 lint 检查和格式化。创建 uniapp cli 项目，并用 vscode 打开

       我项目用的是 uniapp+vue3+vite+ts版本，首先创建项目：

       npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project

       接着用 vscode 打开该项目。

     安装步骤：

     npm install --save-dev eslint-plugin-prettier eslint-config-prettier

     在 eslint.config.js文件中配置数组的末尾添加如下：

     // eslint.config.js// 导入这个可以一次性设置 `eslint-plugin-prettier` 和 `eslint-config-prettier` importeslintPluginPrettierRecommended from'eslint-plugin-prettier/recommended'module.exports =[// 其它配置...// Prettier 扩展插件...eslintPluginPrettierRecommended]

     四、代码并运行测试。

     当项目中有 .git 文件时，打开控制台，重新运行以下命令：

     npmrun prepare

     如果在 .husky包里自动生成了 _包，说明已经激活了 husky。

拓展知识 2：关于ESlint合并的逻辑思路

扁平化结构的配置顺序很重要，首先ESlint会在数组中对象依次执行，对每个配置对象都会先看 files和 ignores是否与目标执行文件路径匹配，匹配上的配置对象，会从前往后依次合并，同属性的后面覆盖前面。项目中的完整代码

如果按照文章安装了上面的插件，可以直接复制使用。重点就看下面这几个：

• files：一个 glob 模式数组，指示配置对象应应用到的文件。如果 ignores在配置对象中没有任何其他键一起使用，则这些模式充当全局忽略项。当指定 files时，这些插件仅对匹配的文件可用，不指定则对全局的 files生效。如果只使用 husky 每次提交前都会把所有的文件都运行一遍 Lint 检查，时间成本太高。如果未指定，则配置对象应用于任何其他配置对象匹配的所有文件。

  

  这样，向 git 提交代码前就会自动执行 lint-staged了。没错！

  已经不是 .eslintrc.cjs文件了！！！
  已经不是 .eslintrc.cjs文件了！！！
  已经不是 .eslintrc.cjs文件了！！！
  而且记住旧版的内容不能直接复制到新版！

  eslint.config.mjs文件生成的代码如下，如果上面没选择 node，可以在下面找到 languageOptions选项，在 globals内加上 ...globals.node。有规则规范更宽松的 stylelint-config-recommended ，安装二选一；

• sass-embedded： Vite 更推荐使用这个插件来代替 Sass，编译速度更快，请看原文。可以不用安装 Stylelint。安装 vscode 插件

  已经安装了 vscode 插件的彦祖们，可以跳过本节。如果未指定，则配置对象应用于 files匹配的所有文件。

  安装兼容包插件，并在 eslint.config.js配置：

  npm install --save-dev @eslint/compat

  // eslint.config.jsimport{includeIgnoreFile }from'@eslint/compat'importpath from'node:path'import{fileURLToPath }from'node:url'const__filename =fileURLToPath(import.meta.url)const__dirname =path.dirname(__filename)consteslintignorePath =path.resolve(__dirname,'.eslintignore')exportdefault[// ignores glob 模式// {//   ignores: ['src/uni_modules/', 'src/static/', '.vscode', '.husky']//},// 使用包含 .eslintignorePath 文件模式includeIgnoreFile(eslintignorePath)]

  接着在项目根目录下创建 .eslintignore文件并添加：

  # uniappsrc/uni_modules/src/static/.vscode.husky

  3. 安装必要的 ESlint 扩展插件

  扩展插件说明：

  • @eslint/js： 附带ESLint 团队推荐的规则，用于给下面其他扩展插件自定义配置扩展对象时，提供一个默认推荐规则。

  1. 安装 ESlint

  npm init @eslint/config@latest --save-dev

  按照以下选项选择：

  @eslint/create-config: v1.4.0√ How would you like to use ESLint? · problems√ What typeof modules does your project use? · esm√ Which framework does your project use? · vue√ Does your project use TypeScript? · typescript√ Where does your code run? · browser, nodeThe config that you've selected requires the following dependencies:eslint, globals, @eslint/js, typescript-eslint, eslint-plugin-vue√ Would you like to installthem now? · No / Yes√ Which package manager doyou want to use? · npm

  注意：Where does your code run? 这一步要把 node 也选上（按空格选中）。需要添加扩展插件对vue文件的支持。

• plugins：一个对象，包含插件名称到插件对象的名称-值映射。

一、

方式1（推荐）：在配置对象里添加 ignores数组：

ESlint默认已经存在 ["**/node_modules/", ".git/"]了，所以不需要再专门配置。引入 Prettier

1. 安装 Prettier

引入 Prettier，--save-exact的作用是锁定版本，也就是版本号前面没有那个 ^。

# Logslogs*.log# Editor directories and files.vscode.idea**/*.svg# projects.huskynode_modulessrc/uni_modules/src/static/dist/# uniapp 插件生成的文件src/pages.jsonsrc/manifest.json

4. 安装必要的 Prettier 扩展插件

在 Prettier 官方文档-Integrating with Linters 里，已经提到如何通过安装扩展插件来解决 ESlint与 Prettier冲突或不必要的规则问题：

扩展插件说明：

• eslint-config-prettier： 关闭所有不必要或可能与Prettier冲突的规则。

  // package.json{"scripts":{// 其它..."lint":"eslint . --ext \"./**/*.{vue,js,ts,jsx,tsx,mjs,cjs}\" --fix","lint:prettier":"prettier \"./**/*.{vue,js,ts,jsx,tsx,mjs,cjs,html,json,md}\" --write","lint:stylelint":"stylelint \"./**/*.{vue,css,scss,html}\" --fix",}}

  7. 重启vscode

  安装好插件并配置好文件后，需要重启 vscode 生效。
  安装插件的版本：

  

  1. eslint.config.mjs文件

  // eslint.config.mjsimportglobals from'globals'importpluginJs from'@eslint/js'import{configs,parser }from'typescript-eslint'importpluginVue from'eslint-plugin-vue'importeslintPluginImportX from'eslint-plugin-import-x'importtsParser from'@typescript-eslint/parser'importeslintPluginPrettierRecommended from'eslint-plugin-prettier/recommended'/** @type {import('eslint').Linter.Config[]} */exportdefault[// ignores 提升为全局忽略项{ignores:['src/uni_modules/','src/static/','.vscode','.husky']},// 全局 files 指定 ESlint 匹配的文件{files:['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx,vue}']},// 基础配置{languageOptions:{globals:{...globals.browser,...globals.node },parser:tsParser,ecmaVersion:'latest',sourceType:'module'}},pluginJs.configs.recommended,...configs.recommended,...pluginVue.configs['flat/essential'],// eslint-plugin-import-x 扩展插件eslintPluginImportX.flatConfigs.recommended,eslintPluginImportX.flatConfigs.typescript,// prettier 扩展插件eslintPluginPrettierRecommended,// 仅对所有 vue 文件的自定义配置{files:['**/*.vue'],languageOptions:{parserOptions:{parser:parser }}},// 自定义 rules{rules:{// 不允许存在未使用的变量'@typescript-eslint/no-unused-vars':'warn',// vue 组件必须多单词驼峰命名，关闭它'vue/multi-word-component-names':'off',// 禁止变量重新声明'@typescript-eslint/no-redeclare':'error',// 禁止变量重新声明，与 @typescript-eslint 重复提示了，关闭它'no-redeclare':'off'}}]

  2. prettier.config.mjs文件

  // prettier.config.mjs/** * @see https://prettier.io/docs/en/configuration.html * @type {import("prettier").Config} */constconfig ={// 不尾随分号semi:false,// 使用单引号singleQuote:true,// 多行逗号分割的语法中，最后一行不加逗号trailingComma:'none',// 行尾风格，设置为autoendOfLine:'auto',// 一行最多 100 字符printWidth:120,// 使用 2 个空格缩进tabWidth:2,// 不使用缩进符，而使用空格useTabs:false,// 单个参数的箭头函数不加括号 x => xarrowParens:'avoid',// 对象大括号内两边是否加空格 { a:0 }bracketSpacing:true}exportdefaultconfig

  3. prettier.config.mjs文件

  注意 extends的顺序：

  // prettier.config.mjs/** @type {import('stylelint').Config} */exportdefault{extends:['stylelint-config-standard','stylelint-config-standard-scss','stylelint-config-standard-vue/scss','stylelint-config-recess-order'],overrides:[// 扫描 .vue/html 文件中的<style>标签内的样式{files:['**/*.{vue,html}'],customSyntax:'postcss-html'},{files:['**/*.{css,scss}'],customSyntax:'postcss-scss'}],rules:{'no-empty-source':null,// 处理不认识 rpx 问题'unit-no-unknown':[true,{ignoreUnits:['rpx']}],// 处理小程序page标签不认识的问题'selector-type-no-unknown':[true,{ignoreTypes:['page']}]}}

  4. .prettierignore文件

  # Logslogs*.log# Editor directories and files.vscode.idea**/*.svg# projects.huskynode_modulessrc/uni_modules/src/static/dist/# uniapp 插件生成的文件src/pages.jsonsrc/manifest.json

  5. .stylelintignore文件

  node_modulessrc/uni_modules/src/static/dist/**/*.svg

  6. package.json 文件

  设置可以一个命令行执行整个项目的代码校验和格式化。

  

  实现的方法也很简单，在根目录创建 .vscode/settings.json文件。

是不是一脸懵逼，扁平化是个啥？没关系，下面会告诉你。引入 ESlint

ESlint更新 v9.x版本后，要记住这几个重要的变化：

1. 最低支持Node.js 版本（^18.18.0、

---

2. 配置 ignore 文件

我在官方文档的忽略文件看了一遍又一遍，发现没有 .eslintignore文件的配置！！！纳尼？居然弃用了。

目前安装的插件版本都是最新的版本。

• eslint-import-resolver-typescript： 让 eslint-plugin-import-x 能够支持 typescript 版本。

  如果想要对所有项目都生效，可以把上面的内容添加到 vscode 的全局设置里。

安装步骤：

npm install --save-dev eslint-plugin-import-x eslint-import-resolver-typescript

在 eslint.config.mjs中配置：

// eslint.config.mjsimportpluginJs from'@eslint/js'importeslintPluginImportX from'eslint-plugin-import-x'importtsParser from'@typescript-eslint/parser'exportdefault[// 其它配置...pluginJs.configs.recommended,eslintPluginImportX.flatConfigs.recommended,eslintPluginImportX.flatConfigs.typescript,{files:['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],ignores:['eslint.config.mjs'],languageOptions:{parser:tsParser,ecmaVersion:'latest',sourceType:'module'},rules:{'no-unused-vars':'off','import-x/no-dynamic-require':'warn','import-x/no-nodejs-modules':'warn'}}]

三、

1. 在 vscode 应用市场搜索安装插件

在vscode 左下角的应用市场，搜索这三个插件并安装：

2. 配置 settings.json 文件

在项目的根目录创建 .vscode/settings.json文件，覆盖 vscode 的设置。以前的格式 eslintrc已弃用，不能将旧版的配置内容直接复制到新版。不加 --save-exact也可以。并且 Vite 已经内置了 CSS 预处理器，无需再安装 postcss，postcss-html 和 postcss-scss，如果编译后样式有问题，那就添加上吧；

stylelint-config-standard-scss： Stylelint 社区推荐的标准可共享 SCSS 规则，规范会比较严格。有规则更宽松的 stylelint-config-recommended-vue，安装二选一；

npm install --save-dev stylelint-config-standard sass-embedded stylelint-config-standard-scss stylelint-config-standard-vue

在 prettier.config.mjs文件里配置扩展插件，注意 extends的顺序：

// prettier.config.mjs/** @type {import('stylelint').Config} */exportdefault{extends:['stylelint-config-standard','stylelint-config-standard-scss','stylelint-config-standard-vue']}

5. 安装非必要的Stylelint 插件

扩展插件说明：

• stylelint-config-recess-order： css 属性按照 Recess 和 Bootstrap 的方式进行排序。

  六、当指定 files或 ignores时，这些规则配置仅对匹配的文件可用，不指定则对全局的 files生效。

  举个栗子，请看下面 eslint.config.mjs里的代码：

  // eslint.config.mjs/** @type {import('eslint').Linter.Config[]} */exportdefault[// 配置对象 1{ignores:['src/uni_modules/','src/static/','.vscode','.husky'],files:['**/*.{js,mjs,cjs,ts,vue}']},// 配置对象 2{languageOptions:{sourceType:'script',rules:{'no-unused-vars':'error'}}},// 配置对象 3{files:['**/*.vue'],languageOptions:{parserOptions:{parser:tseslint.parser }}},// 配置对象 4{files:['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],ignores:['**/a.ts'],languageOptions:{sourceType:'module'},rules:{'no-unused-vars':'off',// 加了命名空间 'import-x/'，避免与其他扩展插件发生冲突'import-x/no-named-as-default-member':'off',}},// 配置对象 5{rules:{'import-x/no-named-as-default-member':'error'}}]

  配置对象2，配置对象5没有 files和 ignores，所以应用于任何其他配置对象匹配的所有文件。不放心可以放到末尾，如下:

  // eslint.config.jsexportdefault[{ignores:['src/uni_modules/','src/static/','.vscode','.husky']}...]

  方式2：就想要创建一个 .eslintignore 文件

  ESlint 也做了这个兼容，但是不建议这么做，后续版本可能不兼容了，而且这样配也挺麻烦的。

npm install --save-dev stylelint-config-recess-order

在 prettier.config.mjs文件里配置扩展插件，注意 extends的顺序：

// prettier.config.mjs/** @type {import('stylelint').Config} */exportdefault{extends:['stylelint-config-recess-order']}

五、

注意！在 ESLint v9.x 中，配置文件名改成 eslint.config.js，并且是新的默认配置格式。

并且会在 package.json文件中会在 "scripts"中自动添加 "prepare": "husky"。

typescript-eslint：能够支持typescript 语法检查。纳尼？又要自己手动配置一次？（痛苦面具）

然后我去 ESlint官网，发现 ESlint已经更新到 v9.16.0版本了（请看更新变化↗），而且 v9.x是破坏版更新，不仅配置文件名不一样，还是新的默认配置格式。

所以想再次详细的记录一下配置 eslint + prettier + stylelint + husky的过程。

二、

规范目标

在集成代码规范前，我们要明确一下目标：

1. 引入 ESlint是为了只做语法错误检查，不做代码格式化（以后 ESlint 将完全废除格式化规则）；
2. 引入 Prettier是为了代码格式化，规范自己的代码；可以格式化 js，ts，vue，json，yaml，html，css/scss/less 文件等，Prettier 有些规则会和 ESlint 冲突，所以需要解决冲突问题；
3. 引入 Stylelint，是为了扩展 style 语法上的错误检查 和 css 属性自动排序。配置如下图：

   

   ---

   上周我 vscode 中创建 uniapp vite-ts项目的时候，发现项目里并没有代码规范与格式化的 modules 。

4. 配置对象4中有 ignores属性，所以匹配不到 a.ts文件；
5. 如果配置对象4中没有 ignores属性，那么 a.ts文件匹配上的有配置对象1，配置对象2，配置对象4，配置对象5，然后根据合并的后面覆盖前面原则，最终：
   'sourceType': 'module'，'no-unused-vars': 'off'，'import-x/no-named-as-default-member': 'error'。

   // eslint.config.mjsimportglobals from"globals";importpluginJs from"@eslint/js";importtseslint from"typescript-eslint";importpluginVue from"eslint-plugin-vue";/** @type {import('eslint').Linter.Config[]} */exportdefault[// 配置对象，全局 files {files:["**/*.{js,mjs,cjs,ts,vue}"]},{languageOptions:{globals:{...globals.browser,...globals.node}}},// @eslint/js 扩展插件pluginJs.configs.recommended,// typescript-eslint 扩展插件...tseslint.configs.recommended,// eslint-plugin-vue 扩展插件...pluginVue.configs["flat/essential"],// eslint-plugin-vue 配置对象属性{files:["**/*.vue"],languageOptions:{parserOptions:{parser:tseslint.parser}}},];

   ---

   拓展知识 1：eslint.config.mjs 扁平化结构（熟悉可跳过）

   只需要记住结构如下，并导出一个配置对象数组，这就是官方说的扁平化配置文件：

   // eslint.config.mjsexportdefault[{配置对象 },扩展插件1,扩展插件2,{扩展插件2的配置对象 },扩展插件3,{扩展插件3的配置对象 },]

   看看配置对象属性。vscode 文件折叠

如果觉得根目录的文件太多，vscode 有一个独门绝活，可以折叠文件！如下图可以发现，eslint.config.mjs就像文件夹一样可以折叠起来。

如果对 style 语法检查没有很大的要求，格式化方面 Prettier 已经足够胜任了。

小知识：

假如你想要在 eslint-plugin-import-x扩展插件修改一些默认的规则，点击这个插件看源码可以发现，源码有一行代码用了 plugins: ["import-x"]，意思是给这个插件加上了规则命名空间，那么在 rules对象中加上 'import-x/'，可以避免与其他插件rules属性发生冲突。

如果使用 ESlint的时候选择了支持 vue和 typescript，那么生成的 eslint.config.mjs中已经引入了 typescript-eslint插件和 eslint-plugin-vue插件，无需再配置了。 引入 lint-staged + Husky

1. 安装 lint-staged 与 Husky

npm install --save-dev lint-staged husky

2. 在 package.json 中配置

// package.json{"scripts":{// 其它配置...},"lint-staged":{"**/*.{vue,js,ts,jsx,tsx,mjs,cjs,html,json,md}":["prettier --write"],"**/*.{vue,js,ts,jsx,tsx,mjs,cjs}":["eslint --cache --fix"],"**/*.{vue,css,scss,html}":["stylelint --fix"]},}

3. 配置 Husky

接着执行以下命令：

npx husky init

运行后，会在项目的根目录生成一个 .husky包，里面包含有 pre-commit文件。

eslint-plugin-vue：能够支持 vue.js 语法检查，并且能够识别 .vue文件。

完成后，会生成 eslint.config.mjs文件。引入 Stylelint

从 Stylelint v15 开始， Stylelint 弃用了所有与 prettier 冲突的风格规则，并在 Stylelint v16 中删除了这些规则，引入 Stylelint 完全不与 Prettier 冲突了。