README-zh_CN.md

@qhlab/eslint-plugin

🧪 Qhlab ESLint 插件集

English | 简体中文

• 安装
• 在 React 中使用
• 在 Vue2 中使用
• 在 Vue3 中使用
• 在原生 JavaScript 中使用
• 单独使用 Prettier 规则
• 配合 typescript 使用
• 配置参考
• 开源协议

安装

第一步，使用 yarn 安装 ESLint：

yarn add eslint -D

第二步，安装 @qhlab/eslint-plugin：

yarn add @qhlab/eslint-plugin -D

在 React 中使用

在实际项目根目录中创建一个 .eslintrc.json 文件。

{
  "extends": ["plugin:@qhlab/react"]
}

在 Vue2 中使用

确保项目中使用的 eslint 为 v7 最新版本，因为 @vue/cli 暂不支持 v8 版本。

yarn add eslint@^7 -D

在实际项目根目录中创建一个 .eslintrc.json 文件。

{
  "extends": ["plugin:@qhlab/vue"]
}

在 Vue3 中使用

确保项目中使用的 eslint 为 v7 最新版本，因为 @vue/cli 暂不支持 v8 版本。

yarn add eslint@^7 -D

在实际项目根目录中创建一个 .eslintrc.json 文件。

{
  "extends": ["plugin:@qhlab/vue3"]
}

在原生 JavaScript 中使用

使用 plugin:@qhlab/base 规则，默认情况下已引入 plugin:@qhlab/react、plugin:@qhlab/vue、plugin:@qhlab/vue3 三种规则。

在实际项目根目录中创建一个 .eslintrc.json 文件。

{
  "extends": ["plugin:@qhlab/base"]
}

单独使用 Prettier 规则

使用 plugin:@qhlab/prettier 规则，默认情况下已引入 plugin:@qhlab/react、plugin:@qhlab/vue、plugin:@qhlab/vue3 三种规则。

在实际项目根目录中创建一个 .eslintrc.json 文件。

{
  "extends": ["...your other rules", "plugin:@qhlab/prettier"]
}

提示: 请确保 prettier 是最新版本，以免配置被覆盖。

配合 typescript 使用

base 配置下已默认引入 typescript 配置，不需要单独引入，并且会覆盖项目中 .ts, .tsx 类型文件原有的配置规则。

可能需要手动添加 parserOptions.project 以指定对应的 tsconfig.json 文件。

一般情况下不需要添加，运行后会自动在当前命令行运行的目录下查找 tsconfig.json 文件，但如果文件不在当前目录下，就需要进行手动配置。

示例

{
  "extends": ["plugin:@qhlab/react"],
  "parserOptions": {
    "project": "./tsconfig.json"
  }
}

配置参考

名称	继承于	是否有修改	规则来源
plugin:@qhlab/prettier	plugin:prettier/recommended	✅	eslint-plugin-prettier
plugin:@qhlab/base	/	✅	eslint official
plugin:@qhlab/react	plugin:@qhlab/base plugin:@qhlab/prettier	✅	eslint-plugin-react
plugin:@qhlab/vue	plugin:@qhlab/base plugin:vue/recommended plugin:@qhlab/prettier	否	eslint-plugin-vue
plugin:@qhlab/vue3	plugin:@qhlab/base plugin:vue/recommended plugin:@qhlab/prettier	否	eslint-plugin-vue

开源协议

MIT

░██████╗░██╗░░██╗██╗░░░░░░█████╗░██████╗░ ██╔═══██╗██║░░██║██║░░░░░██╔══██╗██╔══██╗ ██║██╗██║███████║██║░░░░░███████║██████╦╝ ╚██████╔╝██╔══██║██║░░░░░██╔══██║██╔══██╗ ░╚═██╔═╝░██║░░██║███████╗██║░░██║██████╦╝ ░░░╚═╝░░░╚═╝░░╚═╝╚══════╝╚═╝░░╚═╝╚═════╝░