快速用上 ESLint

在專案中使用 ESLint

環境

Node.js

安裝與使用

本地安裝

作為開發依賴在本地安裝
npm install eslint --save-dev
建立配置檔案
./node_modules/.bin/eslint --init

備註
- 這是一個互動式指令，可以根據你的互動選項給你建立一個配置檔案。
- 配置檔案當然也可以手動來建立。
執行
./node_modules/.bin/eslint <dir | filename>

！注意
- 如果在 windows 下，並且使用 cmd 來執行命令，那麼需要使用反斜槓，即 .\node_modules\.bin\eslint 來執行命令。如果是用 PowerShell 執行則不需要。

注意：

如果在 Windows 下，並且使用 cmd 來執行命令，那麼需要使用反斜槓，即.\node_modules.bin\eslint 來執行命令。如果是用 PowerShell 執行則不需要。

全域性安裝

使 ESLint 適用所有專案，可以全域性安裝
npm install -g eslint

備註
- 全域性安裝之後，可以直接使用 eslint 指令，而不用新增路徑。
- 但是! 由於是全域性指令，那麼配置檔案裡面的依賴也要求是全域性安裝才行。相應地，執行本地指令時，配置檔案裡面的依賴也要相應的安裝在本地。
建立配置檔案
eslint --init
執行 eslint <dir | filename>

常用指令引數

--fix - 能夠對某些規則進行自動修復。（主要是一些不影響程式碼邏輯的基礎問題）

配置檔案

檔案格式

JavaScript - 使用 .eslintrc.js 然後輸出一個配置物件。
YAML - 使用 .eslintrc.yaml 或 eslintrc.yml 去定義配置的結構。
JSON - 使用 .eslintrc.json ，ESLint 的 JSON 檔案允許 JavaScript 風格的註釋。
（棄用） - 使用 .eslintrc ，可以是 JSON 也可以是 YAML。
package.json - 在 package.json 裡建立一個 eslintConfig 屬性，定義配置。

推薦使用 js 檔案，方便註釋

忽略檔案

可以在專案根目錄建立一個 .eslintignore 檔案來告訴 ESLint 去忽略檢查某些檔案或目錄。

注意

只能在根目錄建立，且只有一個忽略檔案，在子目錄建立額外的並不會生效。

配置檔案引數說明

常用

globals: {
    // 指定環境為我們提供了預置的全域性變數
    // 對於那些我們自定義的全域性變數，可以用globals指定
    // 設定每個變數等於true允許變數被重寫，或false不允許被重寫
    //
    // jQuery: false,
    // $: false
},

// 使用一個別人制定好的規則作為基礎
extends: {
    'eslint-config-alloy'
},

// 自定義規則。可以在這裡關閉某些規則，或者配置適合自己的規則
// 優先順序高於 extends
//
// 具體規則配置
// off或0--關閉規則
// warn或1--開啟規則，警告級別(不會導致程式退出)
// error或2--開啟規則，錯誤級別(當被觸發的時候，程式會退出)
rules: {
    "eqeqeq": "warn",
    //你也可以使用對應的數字定義規則嚴重程度
    "curly": 2,
    //如果某條規則有額外的選項，你可以使用陣列字面量指定它們
    //選項可以是字串，也可以是物件
    "quotes": ["error", "double"],
    "one-var": ["error", {
      "var": "always",
      "let": "never",
      "const": "never"
    }],
}
複製程式碼

詳細配置引數

參考：
gist.github.com/rswanderer/…

所有規則說明

參考：（官方文件）
eslint.cn/docs/rules/

快速用上 ESLint

在專案中使用 ESLint

環境

安裝與使用

常用指令引數

配置檔案

檔案格式

忽略檔案

配置檔案引數說明

相關文章