visual studio code代码格式化和eslint语法检查冲突

visual studio code格式化之前，符合eslint

< template >

< div > 动态列表 </ div >

</ template >

< script type = "text/javascript" >

export default {

components: {},

data () {

return {

}

created () {},

mounted () {},

methods: {}

}

</ script >

< style lang = "less" scoped >

</ style >

visual studio code格式化后，不符合eslint，当cnpm run dev,会被eslint检查出一些语法错误，因此两者冲突了。

< template >

< div > 动态列表 </ div >

</ template >

< script type = "text/javascript" >

export default {

components: {},

data () {

return {

};

created () {},

mounted () {},

methods: {}

};

</ script >

< style lang = "less" scoped >

</ style >

eslint检查出来出语法错误

1 error Strings must use singlequote quotes（字符串必须用单引号）
2 error Missing space before function parentheses space-before-function-paren（方法名字和参数之间要空格）
3 error Extra semicolon semi（句末多余的分号）

处理方法一般有两种

1.让visual studio code代码格式化兼容eslint

2.解决第一和第三个问题

创建.prettierrc.json文件（visual studio code格式化的时候会去读这里的规则），

在文件里面输入

{
"semi": false,
"singleQuote": true
}

这样做之后，当visual studio code格式化文件的时候，字符串格式化成单引号，符合eslint语法规则，句末也不加分号。

3.解决 Missing space before function parentheses space-before-function-pa(eslint默认函数名和括号之间必须有空格)

在.eslintrc.js文件中rules:里面增加'space-before-function-paren':0，具体如下：

rules: {
'no-console': 'off',
'no-debugger': 'off',
'space-before-function-paren':0
},

2.简单粗暴不要使用eslint，采用默认的visual studio code代码格式化规则

来源：oschina

链接：https://my.oschina.net/u/4161514/blog/4271874

标签

javascript

eslint

Visual Studio Code

CNPM