ESLint是一個用來識別 ECMAScript 並且按照規則給出報告的程式碼檢測工具，使用它可以避免低階錯誤和統一程式碼的風格。ESLint被設計為完全可配置的，主要有兩種方式來配置ESLint：

• 在註釋中配置：使用JavaScript註釋直接把配置嵌入到JS檔案中。

• 配置檔案：使用下面任一的檔案來為全部的目錄和它的子目錄指定配置資訊。

• javascript：使用.eslintrc.js檔案並匯出一個包含配置的物件。

• YAML：.eslintrc.yaml或者.eslintrc.yml

• JSON：.eslintrc.json，並且此檔案允許使用JS形式的註釋

• 廢棄的用法：.eslintrc，此檔案可以是JSON或者YAML

• package.json：在package.json檔案中建立eslintConfig屬性，所有的配置包含在此屬性中。

這些檔案的優先順序則是按照以上出現的順序（.eslintrc.js > .eslintrc.yaml > .eslintrc.yml > .eslintrc.json > .eslintrc > package.json）。

可以被配置的資訊主要分為3類：

• Environments：你的 javascript 腳步將要執行在什麼環境（如：nodejs，browser，commonjs等）中。

• Globals：執行程式碼時腳步需要訪問的額外全域性變數。

• Rules：開啟某些規則，也可以設定規則的等級。

安裝

---

• 全域性安裝

npm i -g eslint

• 區域性安裝（推薦）

npm i -D eslint

安裝完畢後，接下來新建一個配置檔案.eslintrc.js，或者使用如下的命令列來自動生成。

eslint --init

配置

---

指定執行環境

JavaScript 程式碼可以執行在瀏覽器或 nodejs 等環境中，每個環境的全域性變數都不盡相同（如 nodejs 中沒有 DOM 相關的全域性變數）。在配置檔案中可以自由的指定執行環境。

// .eslintrc.jsmodule.exports = {
  env: {
    browser: true,
    node: true,
  },
};

所有的環境可以在上查詢。

指定全域性變數

可以在配置檔案或註釋中指定額外的全域性變數，false表明變數只讀：

• 使用註釋來配置：

/* global var1, var2 */
/* global var1:false, var2:false */

• 使用配置檔案來配置：

// .eslintrc.jsmodule.exports = {
  globals: {
    var1: true,
    var2: true,
  },
};

規則

在配置檔案中可以設定一些規則。

這些規則的等級有三種：

• "off" 或者 0：關閉規則。

• "warn" 或者 1：開啟規則，並且作為一個警告（不影響exit code）。

• "error" 或者 2：開啟規則，並且作為一個錯誤（exit code將會是1）。

例如：

• 使用配置檔案來配置

// .eslintrc.jsmodule.exports = {
  rules: {
    eqeqeq: 'off',
    curly: 'error',
  },
};

• 使用註釋來配置

/* eslint eqeqeq: "off", curly: "error" */
/* eslint eqeqeq: 0, curly: 2 */

也可以在註釋中關閉所有或者某個規則：

/* eslint-disable *//* eslint-enable *//* eslint-disable no-alert, no-console *//* eslint-enable no-alert, no-console */

具體的規則可以在上找到，或者使用別人寫好的配置，例如。

使用方法

---

命令列

透過命令列工具來使用 eslint 。

eslint [options] file.js [file.js] [dir]

編輯器

配合相應的，在中直接顯示錯誤和警告。

lint

除了上述，還可以配合、等工具來使用。

作者：給我一炷香的時間
連結：
來源：簡書
著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。