vscode配置eslint,实现错误代码标识以及自动修复

ESLint插件

一、安装 eslint 插件

二、vscode 扩展设置

依次点击 文件 > 首选项 > 设置 打开 VSCode 配置文件,添加如下配置:


"eslint.options": {
    "extensions": [".js", ".vue"]
},
"eslint.validate": [
    "javascript",
    "javascriptreact",
    "vue-html",
    {
        "language": "vue",
        "autoFix": true
    },
    {
        "language": "html",
        "autoFix": true
    }
],
"eslint.run": "onSave",
"eslint.autoFixOnSave": true,

如此,每次保存文件的时候就可以根据 .eslintrc.js 配置规则来检查代码和做一些简单的修复

三、自动修复代码

1、什么时候修复错误代码
保存文件的时候 eslint 插件会自动修复代码,保存一次可能没法修复所有的错误,那就多保存几次。

2、关于自动保存
如果你的编辑器设置了自动保存 “files.autoSave”: “afterDelay” ,那么在你修改代码文件自动保存后是不会触发 eslint 自动修复功能的。这个时候仍然需要你手动保存一下(ctrl+s)才会自动修复。

四、vscode忽略文件检查

1、忽略全部文件检查,即禁止eslint:

“eslint.enable”: false

2、忽略部分文件检查
注:vscode eslint 插件貌似没有读取 .eslintignore 文件。

当然,这并不影响项目的开发进程,只是页面会标红而已;
可以用行内配置的方式来解决:/* eslint-disable */

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章