VSCode使用ESLint对代码进行格式化和语法检测

394 阅读1分钟

安装和配置

VSCode安装ESLint插件 image.png

安装成功之后
在VSCode中配置相应的选项
按图打开设置

image.png 在用户的配置,会在打开的项目中生效,即在VSCode中都会生效
在工作区的配置,只和项目有关。项目关闭,配置不会存在。
工作区的配置优先用户配置。

image.png 这里以用户配置为例
找到ESLint就可以勾选需要的选项
也可以在settings中,输入相应的json配置。和勾选效果一样。勾选之后也会生成相应的json

image.png

image.png

启用ESLint格式化代码

设置如下配置

{
   "eslint.format.enable": true,  // 启动eslint做为格式化程序
}

找到一个vue文件,空白处 右键点击

image.png
点击使用...格式化文档(两个格式化工具以上才会出现这个选项)

image.png 点击ESLint就可以对当前的代码进行格式化

ESLint语法检测

默认会执行官方的规则

image.png
这里定义了一个变量,但是没有使用。官方规则就会警告
可以通过在代码中配置ESLint,执行自定义的规则