ESlint 中常见报错的类型和解决方案
这是我在使用 eslint 过程中遇到的一些问题,和自己总结的一些,希望对大家有帮助。
-
vue 中 quotes 报错 :不能使用双引号 “ ”,只能使用单引号 ‘ ’;
-
vue 中 indent 报错:报错代码的这行缩进有问题,直接格式化一下,或者设置一下缩进;
-
vue 中 eol-last 报错:代码的末尾没有 enter 回车,或者在 eslint.js 中 rules 中 加上
'eol-last': 0
;表示不需要在末尾 enter;
-
vue 中 standard/no-callback-literal 报错:这是回调函数的个税错误,需要在 eslint.js 中 添加:
"no-callback-literal": 0
我的代买是这样的:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1H8qPR57-1576466655867)(http://i.caigoubao.cc/627328/1575597377(1)].png)
上面这种方式一般可行性不高,所以还是采用以下的方式就不会报错了:
-
vue 中 curly 报错:例如下面这样写就是错误的
if (res.meta.status !== 200) return this.$message.error('获取用户列表失败!') this.userlist = res.data.users this.total = res.data.total
需要这样写:
if (res.meta.status !== 200) return this.$message.error('获取用户列表失败!') this.userlist = res.data.users this.total = res.data.total
或者是这样写:
if (res.meta.status !== 200) { return this.$message.error('获取用户列表失败!') } else { this.userlist = res.data.users this.total = res.data.total }
就是说 if 条件语句后面执行的代码需要放在 { } 中,如果不写 { } ,则需要并排放在一行。
-
vue 中 no-multiple-empty-lines 报错:代码行之间不允许出现多个空行,你检查代码是否有多个空行吧,有的话去掉空行,行与行之间最多可保留一个空行,或者你在初始化项目的时候在Use ESLint to lint your code 时候选择no;
-
vue 中 no-template-curly-in-string 报错:是因为没有用反斜引号 ``;
const { data: res } = await this.$http.post( 'categories/${this.catdId}/attributes', { params: { attr_name: this.addForm.attr_name, attr_sel: this.activeName } } )
const { data: res } = await this.$http.post( `categories/${this.catdId}/attributes`, { params: { attr_name: this.addForm.attr_name, attr_sel: this.activeName } } )
-
"no-console": "error", // 禁止console "no-alert": "error", // 禁止alert,conirm等 "no-debugger": "error", // 禁止debugger "semi": ["error", "never"], // 禁止分号 "no-tabs": "error", // 禁止使用tab "no-unreachable": "error", // 当有不能执行到的代码时 "eol-last": "error", // 文件末尾强制换行 "no-new": "error", // 禁止在使用new构造一个实例后不赋值 "quotes": ["error", "backtick"], // 引号类型 `` "" '' "no-unused-vars": ["error", { "vars": "all", "args": "after-used" }], // 不能有声明后未被使用的变量 "no-trailing-spaces": "error", // 一行结束后面不要有空格 "space-before-function-paren": ["error", "never"], // 函数定义时括号前面要不要有空格 "no-undef": "error", // 不能有未定义的变量,定义之前必须有var或者let "curly": ["error", "all"], // 必须使用 if(){} 中的{} 'arrow-parens': "error", // 箭头函数的参数要有()包裹 'generator-star-spacing': "error", // allow async-await "space-before-function-paren": ["error", "never"], // 禁止函数名前有空格,如function Test (aaa,bbb) "space-in-parens": ["error", "never"], // 禁止圆括号有空格,如Test( 2, 3 ) "space-infix-ops": "error", //在操作符旁边必须有空格, 如 a + b而不是a+b "space-before-blocks": ["error", "always"], // 语句块之前必须有空格 如 ) {} "spaced-comment":["error", "always"], // 注释前必须有空格 "arrow-body-style": ["error", "always"], // 要求箭头函数必须有大括号 如 a => {} "arrow-parens": ["error", "always"], //要求箭头函数的参数必有用括弧包住,如(a) =>{} "arrow-spacing": ["error", { "before": true, "after": true }], // 定义箭头函数的箭头前后都必须有空格 "no-const-assign": "error", // 禁止修改const变量 "template-curly-spacing": ["error", "never"], // 禁止末班字符串中的{}中的变量出现空格,如以下错误`${ a }` "no-multi-spaces": "error", // 禁止多个空格,只有一个空格的地方必须只有一个 "no-whitespace-before-property": "error", // 禁止属性前有空格,如obj. a "keyword-spacing":["error",{"before": true, "after": true}] //关键字前后必须有空格 如 } else {
-
vue 中 Identifier is not a camel case (camelcase) 报错:这是驼峰命名出现问题,搞了我好长时间,一直不明白什么意思,后来直接在规则中可以不适用用驼峰命名
["error", { "properties": "never" }]
-
属性名 属性值 描述 array-callback-return “error” Array执行回调函数返回语句 indent [“error”, 4, {“SwitchCase”: 1}] 缩写格式的一致性 block-spacing “error” 禁止执行空间内出现’-’ brace-style [“error”,“1tbs”] 代码书写格式验证 camelcase [“error”, { “properties”: “never” }] 属性命名规则可以不使用驼峰命名法 callback-return [“error”, [“cb”, “callback”, “next”]] 回调函数需要return进行返回 comma-spacing “error” 不允许在逗号前面出现空格 comma-style [“error”, “last”] 方数组元素、变量声明等直接需要逗号隔开 consistent-return “error” 保持return返回的一致性 curly [“error”, “all”] 函数或者条件判断时需要统一使用大括号 default-case “error” switch语句中必须有default条件 dot-notation [“error”, { “allowKeywords”: false }] 不允许关键字出现在变量中 eol-last “error” 代码间间隔出现一行 eqeqeq “error” 消除不安全类型的全等操作 guard-for-in “error” for循环中过滤掉一下不被需要的行为 key-spacing [“error”, { “beforeColon”: false, “afterColon”: true }] 键和值前保留一个空格 keyword-spacing “error” 确保字符前后空格的一致性 lines-around-comment [“error”, { “beforeBlockComment”: true, “afterBlockComment”: false, “beforeLineComment”: true, “afterLineComment”: false }] 注释前需要空行,注释后不需要空行 new-cap “error” 构造函数首字母需要大写 newline-after-var [“error”, “never”] var定义后不空行 new-parens “error” 没有参数时,构造函数也需要添加括号 no-invalid-this “error” 不允许关键字this在函数或者类的外面 no-multi-spaces “error” 不允许键和值之间存在多个空格 no-redeclare “error” 不允许重复声明 no-return-assign “error” 不允许在return语句中任务 no-spaced-func “error” 调用函数时,函数名和括号之间不能有空格。 no-trailing-spaces “error” 不允许在语句后存在多余的空格 semi “error” 语句以分号结尾 semi-spacing “error” 分号前后不能有空格 quotes [“error”,“double”] 使用双引号 [space-before-function-paren](http://eslint.org/docs/rules/space-before-function-paren) “space-before-function-paren”: [“error”, “never”] 不允许函数括号之间存在空格 space-in-parens “error” 不允许在括号里面存在空格 space-infix-ops “error” 插入符合变量之间需要添加一个空格 space-unary-ops [“error”, {“words”: true, “nonwords”: false}] 允许一元运算符操作 spaced-comment “error” 注释前需要一个空格 yoda [“error”, “never”] 条件语句中,变量在赋值语句的前面 no-mixed-requires “error” 不允许混合requires文件 no-new-require “error” 不允许new require出现 no-path-concat “error” 不允许路径以_链接 handle-callback-err [“error”, “err”] 处理错误的回调函数 |