vscode中eslint语法报错问题
问题我们使用vue-cli创建项目,默认会启用eslint语法检验,虽然是个好东西,可以让我们的代码格式非常的规范,但是他过于严格的语法规范,比如不能加分号,使用单引号,代码结尾还有有一个空行等等过于严格的要求,让代码经常报错,与修改一个空格,一个分号的事就大大降低了开发效率,所以需要解除一些工具帮我们自动按照esllint进行代码自动规范化。解决我是使用了三个插件来实现保存自动进行代码规范...
·
问题
我们使用vue-cli创建项目,默认会启用eslint语法检验,虽然是个好东西,可以让我们的代码格式非常的规范,但是他过于严格的语法规范,比如不能加分号,使用单引号,代码结尾还有有一个空行等等过于严格的要求,让代码经常报错,与修改一个空格,一个分号的事就大大降低了开发效率,所以需要解除一些工具帮我们自动按照esllint进行代码自动规范化。
解决
我是使用了三个插件来实现保存自动进行代码规范化的功能,非常的方便。
步骤:
1)首先确保自己的vscode中安装了eslint、vetur、prettier这三个插件
2)在配置文件(setting.json)中进行配置
- 按ctrl+shift+p打开搜索setting,打开配置文件
- 在配置文件中添加如下配置
// 在保存的时候进行格式化
"editor.formatOnSave": true,
3)在项目根目录下新建.prettierrc配置文件,对prettier进行设置,配置如下:
因为prettier有个很恶心的功能,就是会将所有的单引号变为双引号,所有语句加上分号,这个明显不符合eslint的语法,所以需要我们进行配置
{
//使用单引号
"singleQuote": true,
//不添加分号
"semi": false
}
4)然而这样配置完还是会报错,eslint要求我们在function和()之间加上一个空格,但是这样并不好看,所以我们可以在.eslintrc.js文件中进行配置,禁用该规则,配置如下:
rules: {
// 禁用方法()前有一个空格
'space-before-function-paren': 0,
//关闭定义未使用的错误
"no-unused-vars": "off"
//关闭缩进检测
'indent': 'off'
}
5)大功告成了
更多推荐
已为社区贡献1条内容
所有评论(0)