- 安装eslint
npm i eslint --D
- 创建ESlint配置文件.eslintrc.js:
eslint --init
以上选项一路回车即可,这些就是使用的eslint规则
- 执行eslint .eslintrc.js文件生成之后,我们就可以使用基本的命令规范我们的代码了,如:
eslint --fix index.js
当然,如果你使用了ES6的语法,上述命令执行后会报如下错误:
Parsing error: Unexpected token = ***
原因是开发环境与ESLint当前的解析功能不兼容,因此我们需要执行下一个步骤;
- 安装 babel-eslint :
npm i babel-eslint --D
安装完成后,在.eslintrc中添加配置:"parser": "babel-eslint" 即可;
-
.eslintrc.js配置参考文件
-
优化package.json
{
"name": "project",
"version": "1.0.0",
"scripts": {
"lint": "eslint --fix pages utils"
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"eslint": "^6.4.0"
},
"license": "ISC",
}
执行以下命令来管理项目中的文件
npm run lint
.eslintrc.js配置参考:
module.exports = {
'env': {
'browser': true,
'node': true,
'es2020': true,
"commonjs": true
},
//配置解析器
"parser": "babel-eslint",
'extends': [
'eslint:recommended',
"prettier",
"prettier/standard"
],
'parserOptions': {
'ecmaVersion': 11,
'sourceType': 'module'
},
//插件
"plugins": [
"prettier"
],
/**
* "off" 或 0 - 关闭规则
* "warn" 或 1 - 开启规则,使用警告级别的错误:warn (不会导致程序退出),
* "error" 或 2 - 开启规则,使用错误级别的错误:error (当被触发的时候,程序会退出)
*/
'rules': {
// 强制使用一致的缩进
'indent': [
'error', 2
],
//禁止空格和 tab 的混合缩进
"no-mixed-spaces-and-tabs": [
"error", "smart-tabs"
],
// 强制在 function的左括号之前使用一致的空格
"space-before-function-paren": [2, "always"],
// 不允许在变量定义之前使用它们
'no-use-before-define': 2,
// 禁止或强制在单行代码块中使用空格(禁用)
"block-spacing": [1, "never"],
// 控制逗号前后的空格
"comma-spacing": [2, {
"before": false,
"after": true
}],
// 文件末尾强制换行
"eol-last": 2,
// 不允许多个空行
"no-multiple-empty-lines": [2, {
"max": 1
}],
// 禁用行尾空格
"no-trailing-spaces": 2,
// 禁止出现未使用过的变量
"no-unused-vars": [2, {
"vars": "all", // all 检测所有变量,包括全局环境中的变量。这是默认值。
"args": "none" // none - 不检查参数。
}],
// 强制一行的最大长度
"max-len": [0, 200, {"ignoreUrls": true}],
// 禁止在条件中使用常量表达式
"no-constant-condition": 2,
// 要求使用 let 或 const 而不是 var
"no-var": 1,
// 禁止修改 const 声明的变量
"no-const-assign": 2,
// 箭头函数两边加上空格
"arrow-spacing": [2, {
"before": true,
"after": true
}],
// 要求操作符周围有空格
"space-infix-ops": 2,
// 强制在圆括号内使用一致的空格
"space-in-parens": [2, "never"],
// 强制在块之前使用一致的空格
"space-before-blocks": [2, "always"],
// 强制分号之前和之后使用一致的空格
"semi-spacing": 2,
// 禁止属性前有空白
"no-whitespace-before-property": 2,
// 对象字面量中冒号的前后空格
"key-spacing": [1, {
"beforeColon": false,
"afterColon": true
}],
// 如果if语句里面有return,后面不能跟else语句
"no-else-return": 1,
}
}