[翻譯] ESLint的配置（一）

ESLint的配置

ESLint徹底配置，這意味着您能夠關閉每一個規則，只運行基本的語法驗證，或者混合並匹配捆綁的規則和自定義規則，使ESLint來完善你的的項目。 配置ESLint有兩種主要方法：

• Configuration Comments（註釋配置）- 使用JavaScript註釋將配置信息直接嵌入文件。

• Configuration Files （文件配置）- 使用JavaScript，JSON或YAML文件來指定整個目錄及其全部子目錄的配置信息。 這能夠是package.json文件中的.eslintrc.*文件或eslintConfig字段的形式，這兩個ESLint都將自動查找和讀取，也能夠在命令行中指定配置文件。

有幾個能夠配置的信息：

• Environments（環境）- 您的腳本運行的環境。每一個環境都帶有一組預約義的全局變量。

• Globals（全局）- 您的腳本在執行期間訪問的其餘全局變量。

• Rules（規則）- 啓用了哪些規則以及什麼錯誤級別。

全部這些選項均可以讓您細粒度的控制ESLint如何處理咱們的代碼。

Specifying Parser Options

ESLint容許您指定要支持的JavaScript語言選項。 默認狀況下，ESLint支持ECMAScript 5語法。 您能夠經過使用解析器選項來覆蓋該設置以支持其餘ECMAScript版本以及JSX。

請注意，支持JSX語法與支持React不一樣。 React將特定語義應用於ESLint沒法識別的JSX語法。 若是您使用React而且須要React語義，咱們建議使用eslint-plugin-react。一樣，支持ES6語法與支持新的ES6全局變量（例如，新的類型，如Set）不一樣。 對於ES6語法，使用{「parserOptions」：{「ecmaVersion」：6}}; 對於新的ES6全局變量，使用{「env」：{「es6」：true}}（此設置自動啓用ES6語法）。 解析器選項經過使用parserOptions屬性在.eslintrc.*文件中設置。 可用的選項有：

• ecmaVersion - 設置爲3，5（默認），6，7或8以指定要使用的ECMAScript語法的版本。 您也能夠設置爲2015（與6）相同，2016（與7相同）或2017（與8相同））使用年度命名。

• sourceType - 若是您的代碼在ECMAScript模塊中，請設置爲「腳本」（默認）或「模塊」。

• ecmaFeatures - 一個對象，指出您要使用哪些其餘語言功能：

  • globalReturn - 容許在全局範圍內使用return

  • impliedStrict - 啓用全局的嚴格模式

  • jsx - 啓用JSX

  • experimentalObjectRestSpread - 啓用對草案或實驗中對象的支持

一個.eslintrc.json例子：

{
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "rules": {
        "semi": 2
    }
}

設置解析器選項有助於ESLint肯定解析錯誤是什麼。 默認狀況下，全部語言選項都爲false。

Specifying Parser

默認狀況下，ESLint使用Espree做爲其解析器。 只要解析器知足如下要求，您能夠選擇指定在配置文件中使用不一樣的解析器：

• 它必須是本地安裝的npm模塊。

• 它必須有一個Esprima兼容的接口（它必須導出一個parse（）方法）。

• 它必須生成與Esprima兼容的AST和令牌對象。

請注意，即便有這些兼容性，也不能保證外部解析器可以與ESLint正常工做，ESLint不會修復與其餘解析器不兼容的錯誤。
要指示要用做解析器的npm模塊，請使用.eslintrc文件中的解析器選項指定它。 例如，如下規定使用Esprima而不是Espree：

{
    "parser": "esprima",
    "rules": {
        "semi": "error"
    }
}

如下解析器與ESLint兼容：

• Esprima

• Babel-ESLint - 圍繞Babel解析器的包裝器，使其與ESLint兼容。

• typescript-eslint-parser（實驗） - 將TypeScript轉換爲ESTree兼容表單的解析器，以即可以在ESLint中使用。 目標是容許由ESLint解析TypeScript文件（儘管不必定經過全部ESLint規則）。

請注意，使用自定義解析器時，ESLint默認狀況下仍然須要parserOptions配置屬性才能正常使用ECMAScript 5中的功能。 解析器都被傳遞給parserOptions，而且可能使用或不使用它們來肯定要啓用哪些功能。

Specifying Environments

可用的環境有：

• 瀏覽器 - 瀏覽器全局變量。

• node - Node.js全局變量和Node.js做用域。

• commonjs - CommonJS全局變量和CommonJS做用域（將其用於使用Browserify / WebPack的僅瀏覽器代碼）。

• shared-node-browser - Node和Browser共同的全局做用域。

• es6 - 啓用除模塊以外的全部ECMAScript 6功能（這將自動將ecmaVersion解析器選項設置爲6）。
  ...

這些環境不是相互排斥的，所以您能夠一次定義多個。

環境能夠在文件內部，配置文件中指定，也能夠使用--env命令行。

要使用JavaScript文件中的註釋指定環境，請使用如下格式：

/* eslint-env node, mocha */

這使Node.js和Mocha環境成爲可能。

要指定配置文件中的環境，請使用env，並經過將每一個環境設置爲true來指定要啓用的環境。 例如，如下功能能夠啓用瀏覽器和Node.js環境：

{
    "env": {
        "browser": true,
        "node": true
    }
}

package.json文件中

{
    "name": "mypackage",
    "version": "0.0.1",
    "eslintConfig": {
        "env": {
            "browser": true,
            "node": true
        }
    }
}

YAML中配置

---
  env:
    browser: true
    node: true

若是要在環境中使用插件，請務必在plugins數組中指定插件名稱，而後使用未修飾的插件名稱，後跟斜槓，後跟環境名稱，例如：

{
    "plugins": ["example"],
    "env": {
        "example/custom": true
    }
}

package.json文件中

{
    "name": "mypackage",
    "version": "0.0.1",
    "eslintConfig": {
        "plugins": ["example"],
        "env": {
            "example/custom": true
        }
    }
}

YAML文件中

---
  plugins:
    - example
  env:
    example/custom: true

Specifying Globals

no-undef規則將對被訪問但未在同一文件中定義的變量發出警告。若是您在文件中使用全局變量，那麼定義這些全局變量是有必要的，以便ESLint不會對其使用狀況發出警告。 您能夠使用文件中的註釋或配置文件來定義全局變量。

要使用JavaScript文件中的註釋來指定全局變量，請使用如下格式：

/* global var1, var2 */

這定義了兩個全局變量var1和var2。 若是要選擇指定這些全局變量永遠不會被寫入（只讀），則能夠使用false標誌來設置每一個變量：

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

要在配置文件中配置全局變量，請使用全局關鍵字並指出要使用的全局變量。將每一個全局變量名設置爲true，以容許變量被覆蓋或false以禁止覆蓋。 例如：

{
    "globals": {
        "var1": true,
        "var2": false
    }
}

YAML中

---
  globals:
    var1: true
    var2: false

這些示例容許在代碼中覆蓋var1，但不容許覆蓋var2。

Configuring Plugins

ESLint支持使用第三方插件。 在使用插件以前，您必須使用npm進行安裝。

要在配置文件中配置插件，請使用plugins，其中包含插件名稱列表。 能夠從插件名稱中省略eslint-plugin-前綴。

{
    "plugins": [
        "plugin1",
        "eslint-plugin-plugin2"
    ]
}

YAML中

---
  plugins:
    - plugin1
    - eslint-plugin-plugin2

Configuring Rules

ESLint附帶了大量的規則。 您能夠使用配置註釋或配置文件修改項目使用的規則。 要更改規則設置，必須將規則ID設置爲如下值之一：

• "off"或0 - 關閉規則

• "warn"或1 - 將規則做爲警告（不影響退出代碼）

• "error"或2 - 將規則打開爲錯誤（觸發時退出代碼爲1）
  要使用配置註釋配置文件內的規則，請使用如下格式的註釋

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

在這個例子中，eqeqeq被關閉，curly被打開做爲一個錯誤。 你也能夠這麼寫：

/* eslint eqeqeq: 0, curly: 2 */

若是規則有其餘選項，則也能夠使用數組來指定，例如：

/* eslint quotes: ["error", "double"], curly: 2 */

此註釋指定引號規則的「double」選項。 數組中的第一個值始終是off/warn/error。
配置文件中:

{
    "rules": {
        "eqeqeq": "off",
        "curly": "error",
        "quotes": ["error", "double"]
    }
}

YAML中

---
rules:
  eqeqeq: off
  curly: error
  quotes:
    - error
    - double

若要配置plugin的規則，方式以下

{
    "plugins": [
        "plugin1"
    ],
    "rules": {
        "eqeqeq": "off",
        "curly": "error",
        "quotes": ["error", "double"],
        "plugin1/rule1": "error"
    }
}

YAML中

---
plugins:
  - plugin1
rules:
  eqeqeq: 0
  curly: error
  quotes:
    - error
    - "double"
  plugin1/rule1: error

固然插件的規則也能夠使用註釋來定義

/* eslint "plugin1/rule1": "error" */

http://eslint.org/docs/user-g...