注意

  1. 如果 .eslintrc.js 和 package.json里的 eslintConfig 同时存在，则只读取 .eslintrc.js文件
  2. 可以使用 ./node_modules/.bin/eslint --init 创建文件 .eslintrc

eslint-plugin-vue

eslint 官方为 vue 提供的插件

babel-eslint

自定义的 eslint 解析器

@vue/cli-plugin-eslint

  • Vue-cli 中提供的 eslint 插件

  • 如果使用 vue-cli 构建项目时选择了eslint 选项，则 cli 会安装 @vue/cli-plugin-eslint 这个包，这个包向 vue-cli-service 注入命令 lint，可在 vue.config.js 中配置 lintOnSave 字段决定是否在保存修改时执行规则检测并修复部分检测不通过的代码；也可手动执行npm/yarn run lint执行 eslint 检测

package.json

1
2
3
"scripts": {
	"lint": "vue-cli-service lint"
},

vue.config.js

1
lintOnSave: process.env.NODE_ENV !== 'production'  //非生产环境启用

第三方 eslint

F2ELint「重要」

f2elint - npm (npmjs.com)

步骤

  1. 全局安装 

    1
    npm install f2elint -g

  2. 项目根目录执行命令，一键接入规约，为项目安装规约 Lint 所需的依赖和配置

    1
    f2elint init

  3. 扫描

    1
    f2elint scan

  4. 修复问题

    1
    f2elint fix

eslint-config-alloy

AlloyTeam/eslint-config-alloy: Progressive ESLint config for your React/Vue/TypeScript projects (github.com)

eslint-config-Airbnb

airbnb/javascript: JavaScript Style Guide (github.com)

eslint-config-standard

IDEA eslint 配置

  • Automatic ESLint configuration 自动根据项目 package 中安装的node_modules/eslint
  • Manual ESLint configuration ，需要先全局安装 eslint，不用勾选 Run eslint –fix on save「以文字描述为准」
image-20210923164501890