eslint官网https://eslint.org/
规则表https://eslint.org/docs/rules/
忽略eslint检查
-忽略单行eslint检查
Use // eslint-disable-next-line to ignore the next line.
// eslint-disable-next-line
- 可以在你的文件中使用以下格式的块注释来临时禁止规则出现警告:
/* eslint-disable */
alert('foo');
/* eslint-enable */
-你也可以对指定的规则启用或禁用警告:
/* eslint-disable no-alert, no-console */
alert('foo');
console.log('bar');
/* eslint-enable no-alert, no-console */
- 忽略整个文件
在项目根目录下创建一个.eslintignore的文件,将你认为没必要加入检查的文件目录放在里面。
/src/views/yourfile.vue
/src/assets/images/picture.png
/node_modules/*
/**/vendor/*.js
- 注释格式汇总
/*eslint-disable*/
/*eslint-enable*/
/*global*/
/*eslint*/
/*eslint-env*/
// eslint-disable-line
// eslint-disable-next-line
配置规则
-vue2配置eslint规则
vue2中,在package.json中配置eslint自定义规则,格式如下
{
"name": "my-website",
"version": "0.1.1",
...
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": {
"@vue/standard"
},
"rules": {
"no-extra-semi": 0,
"eol-last": 0,
"no-empty-character-class": 0
},
}
}
-创建.eslintrc配置规则
你可以在根目录下创建一个.eslintrc的文件,该文件的作用是能管理整个项目的代码检查规则。
{
"extends": "eslint:recommended",
"rules": {
"consistent-return": 2,
"indent" : [1, 4],
"no-else-return" : 1,
"semi" : [1, "always"],
"space-unary-ops" : 2
}
}
eslint 配置
在这里首先推荐一下尾逗号,加上尾逗号的好处只有一个,但真的十分重要,那就是 diff 会非常好看。然后 eslint-plugin-vue 插件是一些预设规则组合,分 base,essential,strongly-recommended,recommended 四级,请自由选择,没有最好的搭配,只要用得舒服就好,团队合作还是非常推荐定好 eslint 规则,使用尽量详细的同一套规则,在代码合并时感觉会非常爽快。
image
设置 eslint 后建议配置开发服务器的 overlay 选项,在 eslint 报错时会覆盖在页面上,时刻提醒你写代码得有信条。
devServer: {
overlay: {
warnings: true,
errors: true,
},
},