ESlint 代码格式大坑vscode vetur，eslint 冲突

ESlint 代码格式大坑vscode vetur，eslint 冲突

团队合作项目中，为了达到代码风格的统一，会使用到eslint，但是通常因为这个eslint，让代码出现不少错误。这篇文章就是让我们解决这个问题的~~~~~~~~~~~~~~~~~~

编辑器默认格式化， ESlint 扩展格式化，vetur 扩展格式化，三者之间的冲突 关闭令人抓狂的ESlint 语法检测配置方法

冲突表现：

```TEXT

[eslint]Parsing error: x-invalid-end-tag.(vue/no-parsing-error)

[eslint-plugin-vue]

[vue/no-parsing-error]

Parsing error: x-invalid-end-tag.

```

解决冲突：

① vscode 设置页面设置

需要使用 ESlint 的格式化，就要将 vscode 编辑器默认的格式化去掉、把 vetur 插件的格式化改写

```JSON

"vetur.validation.template": false // 把 vetur 扩展的 template 格式化去掉

"editor.formatOnSave": false, // 去掉 vscode 自带的自动保存 ，vscode 默认也是 false //的，如果要用 eslint 格式化，默认的格式化就不能开启

"eslint.enable": true, // eslint 格式化的配置

"eslint.autoFixOnSave": true,

"eslint.run": "onType",

"eslint.options": {

"extensions": [".js",".vue"]

},

"eslint.validate": [

"javascript",

{

"language": "vue",

"autoFix": true,

},

"html","vue"

],

```

② .eslintrc.js 文件中设置

extends: # 增加如下两行

"eslint:recommended",

"plugin:vue/recommended"

rules: # 增加如下两行

"vue/no-parsing-error": [2, {

"x-invalid-end-tag": false

}]

① 错误表现

You may use special comments to disable some warnings.

# 您可以使用下面这些 特殊注释 来禁用某些警告

Use // eslint-disable-next-line to ignore the next line. 【对下一行代码 禁止规则出现警告】

# 使用// eslint-disable-next-line 忽略下一行。

Use /* eslint-disable */ to ignore all warnings in a file. 【整个文件范围内 禁止规则出现警告】

# 使用 / * eslint-disable * / 忽略文件中的所有警告。。

# 就是在某个文件顶部写上 /* eslint-disable */

# name整个文件将不受 eslint 的影响，eslint 就不会来检查这个文件了。

原因：

就是因为代码中有不必要的空格，或者是空行，什么的

解决：

上面的 2 种是其中的某些原因的解决办法，还有很多办法，写在夏下面。适当的选择使用，有的时候有的办法是不能使用的。

② 根据提示，修改格式