eslint 的三大通用规则详解
安装
可以全局安装,也可以在项目下面安装。如下是在项目中安装示例,只需要在package.json中添加如下配置,并进行安装:>"eslint":"^4.11.0"
配置
配置方式有两种,但建议使用文件配置的形式,比较独立,便于维护。使用文件配置的方式:在项目的根目录下,新建一个名为.eslintrc的文件,在此文件中添加一些检查规则。
文件配置方式
env:你的脚本将要运行在什么环境中
Environment可以预设好的其他环境的全局变量,如brower、node环境变量、es6环境变量、mocha环境变量等
'env':{ 'browser':true, 'commonjs':true, 'es6':true },
globals:额外的全局变量
globals:{ vue:true, wx:true },
rules:开启规则和发生错误时报告的等级
规则的错误等级有三种:
- 0或'off':关闭规则。
- 1或'warn':打开规则,并且作为一个警告(并不会导致检查不通过)。
- 2或'error':打开规则,并且作为一个错误(退出码为1,检查不通过)。
参数说明:
- 参数1:错误等级
- 参数2:处理方式
配置代码注释方式
有时我们可能要在代码中忽略eslint的某种检查,或者加入某种特定检查,此时我们可以用如下的方式:
示例:
忽略no-undef检查
/*eslint-disableno-undef*/
忽略no-new检查
/*eslint-disableno-new*/
设置检查
/*eslinteqeqeq:off*//*eslinteqeqeq:0*/
eslint检查指令
检查且修复
eslint*--fix
检查指定文件
eslintapp.js--fix
eslint官方提供了3种预安装包:
1、eslint-config-google
Google标准
执行安装:
npminstalleslinteslint-config-google-g
2、eslint-config-airbnb
Airbnb标准,它依赖eslint,eslint-plugin-import,eslint-plugin-react,andeslint-plugin-jsx-a11y等插件,并且对各个插件的版本有所要求。
你可以执行以下命令查看所依赖的各个版本:
npminfo"eslint-config-airbnb@latest"peerDependencies
你会看到以下输出信息,包含每个了每个plugins的版本要求
{eslint:'^3.15.0', 'eslint-plugin-jsx-a11y':'^3.0.2||^4.0.0', 'eslint-plugin-import':'^2.2.0', 'eslint-plugin-react':'^6.9.0'}
知道了每个plugins的版本要求后,代入以下命令执行安装即可使用:
npminstalleslint-config-airbnbeslint@^#.#.#eslint-plugin-jsx-a11y@^#.#.#eslint-plugin-import@^#.#.#eslint-plugin-react@^#.#.#-g
3、eslint-config-standard
Standard标准,它是一些前端工程师自定的标准。
执行安装:
npminstalleslint-config-standardeslint-plugin-standardeslint-plugin-promise-g
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。