配置
有两种主要的方法来配置ESLint:
1、配置注释 - 使用JavaScript注释将配置信息直接嵌入到文件中。
2、配置文件 - 使用下面任一的文件来为全部的目录和它的子目录指定配置信息。
A、javascript:使用.eslintrc.js文件并导出一个包含配置的对象。
B、YAML:.eslintrc.yaml或者.eslintrc.
C、yml JSON:.eslintrc.json,并且此文件允许使用JS形式的注释
D、废弃的用法:.eslintrc,此文件可以是JSON或者YAML
E、package.json:在package.json文件中创建eslintConfig属性,所有的配置包含在此属性中。
这些文件的优先级则是按照以上出现的顺序(.eslintrc.js > .eslintrc.yaml > .eslintrc.yml > .eslintrc.json > .eslintrc > package.json)。
从最高优先级到最低优先级的完整配置层次如下:
1、内联配置
/*eslint-disable*/
/*eslint-enable*/
/*global*/
/*eslint*/
/*eslint-env*/
2、命令行选项:
--global
--rule
--env
-c, --config
3、项目级配置:
.eslintrc.*或者将package.json文件放入与linted文件相同的目录中继续搜索.eslintrc,并package.json在祖先目录中的文件(父具有最高的优先级,然后祖父母等),直至并包括根目录或直到一个配置"root": true中找到。
{
"root": true
}
在没有从(1)到(3)的任何配置的情况下,回到个人的默认配置~/.eslintrc。
*文件或文件中的eslintConfig字段的形式package.json,ESLint将自动查找和读取,也可以在命令行上指定配置文件。如果您的主目录中(通常~/)有配置文件,则ESLint 仅在ESLint找不到任何其他配置文件时才使用它。
如果在同一个目录中找到.eslintrc和package.json找到一个文件,.eslintrc将会优先考虑,并且package.json不会使用文件。
初始化
如果你的项目还没有配置文件(.eslintrc)的话,可以通过指定--init参数来生成一个新的配置文件:
eslint --init
运行eslint --init后,会在当前目录下生成一个.eslintrc文件,你可以在这个文件中配置一些规则。
WebStorm
Preferences -> Languages & Frameworks -> JavaScript -> Code Quality Tools -> Eslint -> Enable (勾选) -> Apply -> OK
命令行
eslint -h
自动修复报错
在package.json文件里面的scripts里面新增一条命令:
"lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/"
npm run lint-fix
使用共享的配置文件
ESLint支持将共享设置添加到配置文件中。我们大多时候,个人或者团队有好几个项目,而每个项目可能使用规则不同,或者需要配置不同的规则,如果都写到一个配置或者每次都改配置文件,管理起来会很麻烦。
新建一个文件比如eslint-config-public.js,在文件内容添加一两个规则。然后将原的.eslintrc.js文件改成这样:
extends: './eslint-config-public.js',
(extends)该属性可以是eslint命令,也可以是继承文件的路径。
1、eslint:all: 表示引入当前版本eslint的所有核心规则。
2、eslint:recommended: 表示引入eslint的核心功能,并且报告一些常见的共同错误。 如果值为绝对或相对路径则相当于导入路径对应的规则配置。
"extends": recommended,
忽略文件
在我们的工程目录中新建一个文件,命名为“.eslintignore”,Eslint会自动识别这个文件。这个配置文件里面,每一行都是一个glob模式语句,
node_modules/*
**/vendor/*.j
除了.eslintignore文件中的任何模式之外,ESLint始终忽略/node_modules/和/bower_components/
.eslintrc.js
module.exports = {
root: true,
parser: 'babel-eslint',
parserOptions: {
sourceType: 'module'
},
env: {
browser: true,
},
// https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
extends: 'standard',
// required to lint *.vue files
plugins: [
'html'
],
// add your custom rules here
'rules': {
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
}
}
解析器(parser):使用了babel-eslint。
环境配置(env):在浏览器中使用eslint。
继承(extends):该配置文件继承了standard规则。
规则(rules):规则。
规则错误等级
规则的错误等级有三种:
- "off" 或者 0:关闭规则
- "warn" 或者 1:打开规则,并且作为一个警告(不影响exit cod。
- "error" 或者 2:打开规则,并且作为一个错误(exit code将会是1)
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。