這個問題，我自己也折騰了很久，在這裡分享給你們。

當前的環境

作業系統: MacOS(雖然我這麼寫，但是對於擴平臺的編輯器來說，沒什麼影響)node版本：v8.9.4vue-cli版本：v3.0.1sublime text版本：v3.1.1 build3176vscode版本：v1.27.2

重要前提

1. 你的程式碼目錄中或者全域性已經安裝eslint以及相關的外掛
2. eslint的配置已經到位，在CLI中已經可以打印出錯誤

PS:如果你的專案目錄是用vue-cli 3.0生成的，那恭喜你，你可以通過使用vue add @vue/eslint新增eslint需要的外掛，並且可以選擇需要遵循的程式碼規範。這部分內容請移步

開啟VSCode的eslint

1. 安裝ESLint外掛，鑑於安裝及其簡單，如果實在需要，安裝外掛的方法參考這裡

macOS下點選Code->首選項->設定，Windows下點選檔案->首選項->設定

在左側選中ESLint，找到Node Path下方的Edit in setting.json

就會開啟全域性配置的json檔案，設定eslint.nodePath和eslint.validate屬性

"eslint.nodePath": "/usr/local/bin/node",
"eslint.validate": [
    "javascript",
    "javascriptreact",
    "vue"
]
 

這兩個是最關鍵的屬性，validate預設是沒有vue的，所以預設是無法在.vue單檔案元件中看到eslint報錯。

其餘的eESLint配置可以根據自身需要進行設定，這裡就不BB了。

設定完這兩個屬性之後，儲存配置，就大功告成了。

開啟程式碼檔案，就會看到紅色波浪線的錯誤提示，滑鼠指標hover在波浪線的地方，就會看到具體的報錯了，比如下圖的這個地方，報錯顯示定義了a但是作用於範圍內沒有使用到。

開啟Sublime Text的eslint

安裝完成後，點選 Preference->Package settings->SublimeLinter->Settings，macOS需要到Sublime Text選單中找Preference

會看到打開了一個配置檔案，將下方的這段配置貼上到右邊的User Settings，儲存。設定中新增

{
    "linters": {
        "eslint": {
            "selector": "text.html.vue, source.js - meta.attribute-with-value"
        }
    }
}

開啟程式碼檔案，此時會看到行號左邊的小紅點報錯，hover滑鼠上去就會提示具體的報錯資訊，搞定！！

寫在後面

上面的配置都是為了滿足我使用vue開發的需要，如果是其他框架，有可能不適用，祝你幸福。