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 */

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