ESLint 配置

ESLint 配置

ESlint 被設(shè)計為完全可配置的,這意味著你可以關(guān)閉每一個規(guī)則而只運行基本語法驗證幔崖,或混合和匹配 ESLint 默認(rèn)綁定的規(guī)則和你的自定義規(guī)則,以讓 ESLint 更適合你的項目蜻直。有兩種主要的方式來配置 ESLint:

  1. Configuration Comments - 使用 JavaScript 注釋把配置信息直接嵌入到一個代碼源文件中耻陕。
  2. Configuration Files - 使用 JavaScript、JSON 或者 YAML 文件為整個目錄和它的子目錄指定配置信息绘盟○妫可以配置一個獨立的 .eslintrc.* 文件,或者直接在 package.json 文件里的 eslintConfig 字段指定配置龄毡,ESLint 會查找和自動讀取它們吠卷,再者,你可以在命令行運行時指定一個任意的配置文件稚虎。

有很多信息可以配置:

  • Environments - 指定腳本的運行環(huán)境撤嫩。每種環(huán)境都會有一組特定的預(yù)定義全局變量。
  • Globals - 腳本在執(zhí)行期間訪問的額外的全局變量蠢终。
  • Rules - 啟用的規(guī)則及其各自的錯誤級別序攘。

所有這些選項讓你可以細(xì)粒度地控制 ESLint 如何對待你的代碼。

指定解析器選項

ESLint 允許你指定你想要支持的 JavaScript 語言選項寻拂。默認(rèn)情況下程奠,ESLint 支持 ECMAScript 5 語法。你可以覆蓋該設(shè)置祭钉,以啟用對 ECMAScript 其它版本和 JSX 的支持瞄沙。

請注意,對 JSX 語法的支持不用于對 React 的支持。React 使用了一些特定的 ESLint 無法識別的 JSX 語法距境。如果你正在使用 React 并且想要 React 語義支持申尼,我們推薦你使用 eslint-plugin-react

同樣的垫桂,支持 ES6 語法并不意味著同時支持新的 ES6 全局變量或類型(比如 Set 等新類型)师幕。使用 { "parserOptions": { "ecmaVersion": 6 } } 來啟用 ES6 語法支持;要額外支持新的 ES6 全局變量诬滩,使用 { "env":{ "es6": true } }(這個設(shè)置會同時自動啟用 ES6 語法支持)霹粥。

解析器選項可以在 .eslintrc.* 文件使用 parserOptions 屬性設(shè)置√勰瘢可用的選項有:

  • ecmaVersion - 默認(rèn)設(shè)置為 5后控, 你可以使用 3、5空镜、6浩淘、7 或 8 來指定你想要使用的 ECMAScript 版本。你也可以用使用年份命名的版本號指定為 2015(同 6)吴攒,2016(同 7)馋袜,或 2017(同 8)
  • sourceType - 設(shè)置為 "script" (默認(rèn)) 或 "module"(如果你的代碼是 ECMAScript 模塊)。
  • ecmaFeatures - 這是個對象舶斧,表示你想使用的額外的語言特性:globalReturn - 允許在全局作用域下使用 return 語句impliedStrict - 啟用全局 strict mode (如果 ecmaVersion 是 5 或更高)jsx - 啟用 JSXexperimentalObjectRestSpread - 啟用實驗性的 object rest/spread properties 支持欣鳖。(重要:這是一個實驗性的功能,在未來可能會有明顯改變。 建議你寫的規(guī)則 不要 依賴該功能茴厉,除非當(dāng)它發(fā)生改變時你愿意承擔(dān)維護成本泽台。)

.eslintrc.json 文件示例:

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

設(shè)置解析器選項能幫助 ESLint 確定什么是解析錯誤螃成,所有語言選項默認(rèn)都是 false倾剿。

指定解析器

ESLint 默認(rèn)使用Espree作為其解析器燕刻,你可以在配置文件中指定一個不同的解析器蒿秦,只要該解析器符合下列要求:

  1. 它必須是本地安裝的一個 npm 模塊。
  2. 它必須有兼容 Esprima 的接口(它必須輸出一個 parse() 方法)
  3. 它必須產(chǎn)出兼容 Esprima 的 AST 和 token 對象病袄。

注意轻腺,即使?jié)M足這些兼容性要求劫哼,也不能保證一個外部解析器可以與 ESLint 正常配合工作琉雳,ESLint 也不會修復(fù)與其它解析器不兼容的相關(guān) bug样眠。

為了表明使用該 npm 模塊作為你的解析器,你需要在你的 .eslintrc 文件里指定 parser 選項翠肘。例如檐束,下面的配置指定了 Esprima 作為解析器:

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

以下解析器與 ESLint 兼容:

  • Esprima
  • Babel-ESLint - 一個對Babel解析器的包裝,使其能夠與 ESLint 兼容束倍。
  • typescript-eslint-parser(實驗) - 一個把 TypeScript 轉(zhuǎn)換為 ESTree 兼容格式的解析器被丧,這樣它就可以在 ESLint 中使用了盟戏。這樣做的目的是通過 ESLint 來解析 TypeScript 文件(盡管不一定必須通過所有的 ESLint 規(guī)則)。

注意甥桂,在使用自定義解析器時柿究,為了讓 ESLint 在處理非 ECMAScript 5 特性時正常工作,配置屬性 parserOptions 仍然是必須的黄选。解析器會被傳入 parserOptions笛求,但是不一定會使用它們來決定功能特性的開關(guān)。

指定環(huán)境

一個“環(huán)境”定義了一組預(yù)定義的全局變量糕簿。可用的環(huán)境包括:

  • browser - 瀏覽器環(huán)境中的全局變量狡孔。
  • node - Node.js 全局變量和 Node.js 作用域懂诗。
  • commonjs - CommonJS 全局變量和 CommonJS 作用域 (一般用于 Browserify/WebPack 打包的只在瀏覽器中運行的代碼)。
  • shared-node-browser - Node 和 Browser 通用全局變量苗膝。
  • es6 - 啟用除了 modules 以外的所有 ECMAScript 6 特性(該選項會自動設(shè)置 ecmaVersion 解析器選項為 6)殃恒。
  • worker - Web Workers 全局變量。
  • amd - 將 require()define() 定義為像 amd 一樣的全局變量辱揭。
  • mocha - 添加所有的 Mocha 測試全局變量离唐。
  • jasmine - 添加所有的 Jasmine 版本 1.3 和 2.0 的測試全局變量。
  • jest - Jest 全局變量问窃。
  • phantomjs - PhantomJS 全局變量亥鬓。
  • protractor - Protractor 全局變量。
  • qunit - QUnit 全局變量域庇。
  • jquery - jQuery 全局變量嵌戈。
  • prototypejs - Prototype.js 全局變量。
  • shelljs - ShellJS 全局變量听皿。
  • meteor - Meteor 全局變量熟呛。
  • mongo - MongoDB 全局變量。
  • applescript - AppleScript 全局變量尉姨。
  • nashorn - Java 8 Nashorn 全局變量庵朝。
  • serviceworker - Service Worker 全局變量。
  • atomtest - Atom 測試全局變量又厉。
  • embertest - Ember 測試全局變量九府。
  • webextensions - WebExtensions 全局變量。
  • greasemonkey - GreaseMonkey 全局變量覆致。

這些環(huán)境并不是互斥的昔逗,所以你可以同時定義多個。

可以在源文件里篷朵、在配置文件中或使用 命令行--env 選項來指定環(huán)境勾怒。

要在你的 JavaScript 文件中使用注釋來指定環(huán)境婆排,格式如下:

/* eslint-env node, mocha */

該設(shè)置啟用了 Node.js 和 Mocha 環(huán)境。

要在配置文件里指定環(huán)境笔链,使用 env 關(guān)鍵字指定你想啟用的環(huán)境段只,并設(shè)置它們?yōu)?true。例如鉴扫,以下示例啟用了 browser 和 Node.js 的環(huán)境:

{
    "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

如果你想在一個特定的插件中使用一種環(huán)境赞枕,確保提前在 plugins 數(shù)組里指定了插件名,然后在 env 配置中不帶前綴的插件名后跟一個 / 坪创,緊隨著環(huán)境名炕婶。例如:

{
    "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

指定全局變量

當(dāng)訪問當(dāng)前源文件內(nèi)未定義的變量時,no-undef 規(guī)則將發(fā)出警告莱预。如果你想在一個源文件里使用全局變量柠掂,推薦你在 ESLint 中定義這些全局變量,這樣 ESLint 就不會發(fā)出警告了依沮。你可以使用注釋或在配置文件中定義全局變量涯贞。

要在你的 JavaScript 文件中,用注釋指定全局變量危喉,格式如下:

/* global var1, var2 */

這里定義了兩個全局變量:var1var2宋渔。如果你想指定這些變量不應(yīng)被重寫(只讀),你可以將它們設(shè)置為 false

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

在配置文件里配置全局變量時辜限,使用 globals 指出你要使用的全局變量皇拣。將變量設(shè)置為 true 將允許變量被重寫,或 false 將不允許被重寫薄嫡。比如:

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

在 YAML 中:

---
  globals:
    var1: true
    var2: false

在這些例子中 var1 允許被重寫审磁,var2 不允許被重寫。

注意: 要啟用no-global-assign規(guī)則來禁止對只讀的全局變量進行修改岂座。

配置插件

ESLint 支持使用第三方插件态蒂。在使用插件之前,你必須使用 npm 安裝它费什。

在配置文件里配置插件時钾恢,可以使用 plugins 關(guān)鍵字來存放插件名字的列表。插件名稱可以省略 eslint-plugin- 前綴鸳址。

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

在 YAML 中:

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

注意:全局安裝的 ESLint 只能使用全局安裝的插件瘩蚪。本地安裝的 ESLint 不僅可以使用本地安裝的插件,也可以使用全局安裝的插件稿黍。

配置規(guī)則

ESLint 附帶有大量的規(guī)則疹瘦。你可以使用注釋或配置文件修改你項目中要使用的規(guī)則。要改變一個規(guī)則設(shè)置巡球,你必須將規(guī)則 ID 設(shè)置為下列值之一:

  • "off"0 - 關(guān)閉規(guī)則
  • "warn"1 - 開啟規(guī)則言沐,使用警告級別的錯誤:warn (不會導(dǎo)致程序退出)
  • "error"2 - 開啟規(guī)則邓嘹,使用錯誤級別的錯誤:error (當(dāng)被觸發(fā)的時候,程序會退出)

為了在文件注釋里配置規(guī)則险胰,使用以下格式的注釋:

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

在這個例子里汹押,eqeqeq 規(guī)則被關(guān)閉,curly 規(guī)則被打開起便,定義為錯誤級別棚贾。你也可以使用對應(yīng)的數(shù)字定義規(guī)則嚴(yán)重程度:

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

這個例子和上個例子是一樣的,只不過它是用的數(shù)字而不是字符串榆综。eqeqeq 規(guī)則是關(guān)閉的妙痹,curly 規(guī)則被設(shè)置為錯誤級別。

如果一個規(guī)則有額外的選項鼻疮,你可以使用數(shù)組字面量指定它們怯伊,比如:

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

這條注釋為規(guī)則 quotes 指定了 “double”選項。數(shù)組的第一項總是規(guī)則的嚴(yán)重程度(數(shù)字或字符串)陋守。

還可以使用 rules 連同錯誤級別和任何你想使用的選項,在配置文件中進行規(guī)則配置利赋。例如:

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

在 YAML 中:

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

配置定義在插件中的一個規(guī)則的時候水评,你必須使用 插件名/規(guī)則ID 的形式。比如:

{
    "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

在這些配置文件中媚送,規(guī)則 plugin1/rule1 表示來自插件 plugin1rule1 規(guī)則中燥。你也可以使用這種格式的注釋配置,比如:

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

注意:當(dāng)指定來自插件的規(guī)則時塘偎,確保刪除 eslint-plugin- 前綴疗涉。ESLint 在內(nèi)部只使用沒有前綴的名稱去定位規(guī)則。

使用行注釋禁用規(guī)則

可以在你的文件中使用以下格式的塊注釋來臨時禁止規(guī)則出現(xiàn)警告:

/* eslint-disable */

alert('foo');

/* eslint-enable */

你也可以對指定的規(guī)則啟用或禁用警告:

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

alert('foo');
console.log('bar');

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


如果在整個文件范圍內(nèi)禁止規(guī)則出現(xiàn)警告吟秩,將 /* eslint-disable */ 塊注釋放在文件頂部:

/* eslint-disable */

alert('foo');

你也可以對整個文件啟用或禁用警告:

/* eslint-disable no-alert */

// Disables no-alert for the rest of the file
alert('foo');

可以在你的文件中使用以下格式的行注釋在某一特定的行上禁用所有規(guī)則:

alert('foo'); // eslint-disable-line

// eslint-disable-next-line
alert('foo');

在某一特定的行上禁用某個指定的規(guī)則:

alert('foo'); // eslint-disable-line no-alert

// eslint-disable-next-line no-alert
alert('foo');

在某個特定的行上禁用多個規(guī)則:

alert('foo'); // eslint-disable-line no-alert, quotes, semi

// eslint-disable-next-line no-alert, quotes, semi
alert('foo');

上面的所有方法同樣適用于插件規(guī)則咱扣。例如,禁止 eslint-plugin-examplerule-name 規(guī)則涵防,把插件名(example)和規(guī)則名(rule-name)結(jié)合為 example/rule-name

foo(); // eslint-disable-line example/rule-name

注意:為文件的某部分禁用警告的注釋闹伪,告訴 ESLint 不要對禁用的代碼報告規(guī)則的沖突。ESLint 仍解析整個文件壮池,然而偏瓤,禁用的代碼仍需要是有效的 JavaScript 語法。

添加分享配置

ESLint 支持在配置文件添加共享設(shè)置椰憋。你可以添加 settings 對象到配置文件厅克,它將提供給每一個將被執(zhí)行的規(guī)則。如果你想添加的自定義規(guī)則而且使它們可以訪問到相同的信息橙依,這將會很有用证舟,并且很容易配置硕旗。

在 JSON 中:

{
    "settings": {
        "sharedData": "Hello"
    }
}

在 YAML 中:

---
  settings:
    sharedData: "Hello"

使用配置文件

有兩種方式可以使用配置文件。第一種是將文件保存到你喜歡的地方褪储,然后將它的位置使用 -c 選項傳遞命令行卵渴,比如:

eslint -c myconfig.json myfiletotest.js

第二種方式是通過 .eslintrc.*package.json。ESLint 將自動在要檢測的文件目錄里尋找它們鲤竹,緊接著是父級目錄浪读,一直到文件系統(tǒng)的根目錄。當(dāng)你想對一個項目的不同部分的使用不同配置辛藻,或當(dāng)你希望別人能夠直接使用 ESLint碘橘,而無需記住要在配置文件中傳遞什么,這種方式就很有用吱肌。

每種情況痘拆,配置文件都會覆蓋默認(rèn)設(shè)置。

配置文件文件格式

ESLint 支持幾種格式的配置文件:

  • JavaScript - 使用 .eslintrc.js 然后輸出一個配置對象氮墨。
  • YAML - 使用 .eslintrc.yaml.eslintrc.yml 去定義配置的結(jié)構(gòu)纺蛆。
  • JSON - 使用 .eslintrc.json 去定義配置的結(jié)構(gòu),ESLint 的 JSON 文件允許 JavaScript 風(fēng)格的注釋规揪。
  • (不推薦) - 使用 .eslintrc桥氏,可以使 JSON 也可以是 YAML。
  • package.json - 在 package.json 里創(chuàng)建一個 eslintConfig屬性猛铅,在那里定義你的配置字支。

如果同一個目錄下有多個配置文件,ESLint 只會使用一個奸忽。優(yōu)先級順序如下:

  1. .eslintrc.js
  2. .eslintrc.yaml
  3. .eslintrc.yml
  4. .eslintrc.json
  5. .eslintrc
  6. package.json

配置的層級和繼承

當(dāng)使用 .eslintrc.*package.json文件的配置時堕伪,你可以利用層疊配置。例如栗菜,假如你有以下結(jié)構(gòu):

your-project
├── .eslintrc
├── lib
│ └── source.js
└─┬ tests
  ├── .eslintrc
  └── test.js

層疊配置使用離要檢測的文件最近的 .eslintrc文件作為最高優(yōu)先級欠雌,然后才是父目錄里的配置文件,等等疙筹。當(dāng)你在這個項目中允許 ESLint 時桨昙,lib/下面的所有文件將使用項目根目錄里的 .eslintrc 文件作為它的配置文件。當(dāng) ESLint 遍歷到 test/ 目錄腌歉,your-project/.eslintrc 之外蛙酪,它還會用到 your-project/tests/.eslintrc。所以 your-project/tests/test.js 是基于它的目錄層次結(jié)構(gòu)中的兩個.eslintrc 文件的組合翘盖,并且離的最近的一個優(yōu)先桂塞。通過這種方式,你可以有項目級 ESLint 設(shè)置馍驯,也有覆蓋特定目錄的 ESLint 設(shè)置阁危。

同樣的玛痊,如果在根目錄的 package.json 文件中有一個 eslintConfig 字段,其中的配置將使用于所有子目錄狂打,但是當(dāng) tests 目錄下的 .eslintrc 文件中的規(guī)則與之發(fā)生沖突時擂煞,就會覆蓋它。

your-project
├── package.json
├── lib
│ └── source.js
└─┬ tests
  ├── .eslintrc
  └── test.js

如果同一目錄下 .eslintrcpackage.json 同時存在趴乡,.eslintrc 優(yōu)先級高會被使用对省,package.json 文件將不會被使用。

注意:如果在你的主目錄下有一個自定義的配置文件 (~/.eslintrc) 晾捏,如果沒有其它配置文件時它才會被使用蒿涎。因為個人配置將適用于用戶目錄下的所有目錄和文件,包括第三方的代碼惦辛,當(dāng) ESLint 運行時可能會導(dǎo)致問題劳秋。

默認(rèn)情況下,ESLint 會在所有父級目錄里尋找配置文件胖齐,一直到根目錄玻淑。如果你想要你所有項目都遵循一個特定的約定時,這將會很有用呀伙,但有時候會導(dǎo)致意想不到的結(jié)果补履。為了將 ESLint 限制到一個特定的項目,在你項目根目錄下的 package.json 文件或者 .eslintrc.* 文件里的 eslintConfig 字段下設(shè)置 "root": true区匠。ESLint 一旦發(fā)現(xiàn)配置文件中有 "root": true干像,它就會停止在父級目錄中尋找帅腌。

{
    "root": true
}

在 YAML 中:

---
  root: true

例如驰弄,projectAlib/ 目錄下的 .eslintrc 文件中設(shè)置了 "root": true。這種情況下速客,當(dāng)檢測 main.js 時戚篙,lib/ 下的配置將會被使用,projectA/ 下的 .eslintrc 將不會被使用溺职。

home
└── user
    ├── .eslintrc <- Always skipped if other configs present
    └── projectA
        ├── .eslintrc  <- Not used
        └── lib
            ├── .eslintrc  <- { "root": true }
            └── main.js

完整的配置層次結(jié)構(gòu)岔擂,從最高優(yōu)先級最低的優(yōu)先級,如下:

  1. 行內(nèi)配置
    1. /*eslint-disable*//*eslint-enable*/
    2. /*global*/
    3. /*eslint*/
    4. /*eslint-env*/
  2. 命令行選項:
    1. --global
    2. --rule
    3. --env
    4. -c浪耘、--config
  3. 項目級配置:
    1. 與要檢測的文件在同一目錄下的 .eslintrc.*package.json 文件
    2. 繼續(xù)在父級目錄尋找 .eslintrcpackage.json文件乱灵,直到根目錄(包括根目錄)或直到發(fā)現(xiàn)一個有"root": true的配置。
    3. 如果不是(1)到(3)中的任何一種情況七冲,退回到 ~/.eslintrc 中自定義的默認(rèn)配置痛倚。

擴展配置文件

一個配置文件可以被基礎(chǔ)配置中的已啟用的規(guī)則繼承。

extends 屬性值可以是:

  • 在配置中指定的一個字符串
  • 字符串?dāng)?shù)組:每個配置繼承它前面的配置

ESLint 遞歸地進行擴展配置澜躺,所以一個基礎(chǔ)的配置也可以有一個 extends 屬性蝉稳。

rules 屬性可以做下面的任何事情以擴展(或覆蓋)規(guī)則:

  • 啟用額外的規(guī)則
  • 改變繼承的規(guī)則級別而不改變它的選項:
    • 基礎(chǔ)配置:"eqeqeq": ["error", "allow-null"]
    • 派生的配置:"eqeqeq": "warn"
    • 最后生成的配置:"eqeqeq": ["warn", "allow-null"]
  • 覆蓋基礎(chǔ)配置中的規(guī)則的選項
    • 基礎(chǔ)配置:"quotes": ["error", "single", "avoid-escape"]
    • 派生的配置:"quotes": ["error", "single"]
    • 最后生成的配置:"quotes": ["error", "single"]

使用 eslint:recommended

值為 "eslint:recommended"extends 屬性啟用一系列核心規(guī)則抒蚜,這些規(guī)則報告一些常見問題,在 規(guī)則頁面 中被標(biāo)記為 耘戚。這個推薦的子集只能在 ESLint 主要版本進行更新嗡髓。

如果你的配置集成了推薦的規(guī)則:在你升級到 ESLint 新的主版本之后,在你使用命令行--fix 選項之前收津,檢查一下報告的問題饿这,這樣你就知道一個新的可修復(fù)的推薦的規(guī)則將更改代碼。

eslint --init 命令可以創(chuàng)建一個配置朋截,這樣你就可以繼承推薦的規(guī)則蛹稍。

JavaScript 格式的一個配置文件的例子:

module.exports = {
    "extends": "eslint:recommended",
    "rules": {
        // enable additional rules
        "indent": ["error", 4],
        "linebreak-style": ["error", "unix"],
        "quotes": ["error", "double"],
        "semi": ["error", "always"],

        // override default options for rules from base configurations
        "comma-dangle": ["error", "always"],
        "no-cond-assign": ["error", "always"],

        // disable rules from base configurations
        "no-console": "off",
    }
}

使用可共享的配置包

可共享的配置 是一個 npm 包,它輸出一個配置對象部服。要確保這個包安裝在 ESLint 能請求到的目錄下唆姐。

extends 屬性值可以省略包名的前綴 eslint-config-

eslint --init 命令可以創(chuàng)建一個配置廓八,這樣你就可以擴展一個流行的風(fēng)格指南(比如奉芦,eslint-config-standard)。

YAML 格式的一個配置文件的例子:

extends: standard
rules:
  comma-dangle:
    - error
    - always
  no-empty: warn

使用插件中的配置

插件 是一個 npm 包剧蹂,通常輸出規(guī)則声功。一些插件也可以輸出一個或多個命名的 配置。要確保這個包安裝在 ESLint 能請求到的目錄下宠叼。

plugins 屬性值 可以省略包名的前綴 eslint-plugin-先巴。

extends 屬性值可以由以下組成:

  • plugin:
  • 包名 (省略了前綴,比如冒冬,react)
  • /
  • 配置名稱 (比如 recommended)

JSON 格式的一個配置文件的例子:

{
    "plugins": [
        "react"
    ],
    "extends": [
        "eslint:recommended",
        "plugin:react/recommended"
    ],
    "rules": {
       "no-set-state": "off"
    }
}

使用一個配置文件

extends 屬性值可以是基本配置文件的絕對路徑或相對路徑伸蚯。

ESLint 解析基本配置文件的相對路徑相對你你使用的配置文件,除非那個文件在你的主目錄或非 ESLint 安裝目錄的父級目錄简烤。在這些情況下剂邮,ESLint 解析基本配合文件的相對路徑相對于被檢測的 項目目錄(尤其是當(dāng)前工作目錄)。

JSON 格式的一個配置文件的例子:

{
    "extends": [
        "./node_modules/coding-standard/eslintDefaults.js",
        "./node_modules/coding-standard/.eslintrc-es6",
        "./node_modules/coding-standard/.eslintrc-jsx"
    ],
    "rules": {
        "eqeqeq": "warn"
    }
}

使用 eslint:all

extends 屬性值可以是 "eslint:all"横侦,啟用當(dāng)前安裝的 ESLint 中所有的核心規(guī)則挥萌。這些規(guī)則可以在 ESLint 的任何版本進行更改。

重要:這些配置 不推薦在產(chǎn)品中使用枉侧,因為它隨著 ESLint 版本進行更改引瀑。使用的話,請自己承擔(dān)風(fēng)險榨馁。

如果你配置 ESLint 升級時自動地啟用新規(guī)則憨栽,當(dāng)源碼沒有任何改變時,ESLint 可以報告新問題,因此任何 ESLint 的新的小版本好像有破壞性的更改徒像。

當(dāng)你決定在一個項目上使用的規(guī)則和選項黍特,尤其是如果你很少覆蓋選項或禁用規(guī)則,你可能啟用所有核心規(guī)則作為一種快捷方式使用锯蛀。規(guī)則的默認(rèn)選項并不是 ESLint 推薦的(例如灭衷,quotes 規(guī)則的默認(rèn)選項并不意味著雙引號要比單引號好)。

如果你的配置擴展了所有的核心規(guī)則:在你升級到一個新的大或小的 ESLint 版本旁涤,在你使用命令行--fix 選項之前翔曲,檢查一下報告的問題,這樣你就知道一個新的可修復(fù)的規(guī)則將更改代碼劈愚。

JavaScript 格式的一個配置文件的例子:

module.exports = {
    "extends": "eslint:all",
    "rules": {
        // override default options
        "comma-dangle": ["error", "always"],
        "indent": ["error", 2],
        "no-cond-assign": ["error", "always"],

        // disable now, but enable in the future
        "one-var": "off", // ["error", "never"]

        // disable
        "init-declarations": "off",
        "no-console": "off",
        "no-inline-comments": "off",
    }
}

基于 glob 模式的配置

有時瞳遍,你可能需要更精細(xì)的配置,比如菌羽,如果同一個目錄下的文件需要有不同的配置掠械。因此,你可以在配置中使用 overrides 鍵注祖,它只適用于匹配特定的 glob 模式的文件猾蒂,使用你在命令行上傳遞的格式 (e.g., app/**/*.test.js)。

怎么工作

  • Glob 模式覆蓋只能在配置文件 (.eslintrc.*package.json) 中進行配置是晨。
  • 模式應(yīng)用于相對于配置文件的目錄的文件路徑肚菠。 比如,如果你的配置文件的路徑為 /Users/john/workspace/any-project/.eslintrc.js 而你要檢測的路徑為 /Users/john/workspace/any-project/lib/util.js罩缴,那么你在 .eslintrc.js 中提供的模式是相對于 lib/util.js 來執(zhí)行的.
  • 在相同的配置文件中蚊逢,Glob 模式覆蓋比其他常規(guī)配置具有更高的優(yōu)先級。 同一個配置中的多個覆蓋將按順序被應(yīng)用箫章。也就是說烙荷,配置文件中的最后一個覆蓋會有最高優(yōu)先級。
  • 一個 glob 特定的配置幾乎與 ESLint 的其他配置相同炉抒。覆蓋塊可以包含常規(guī)配置中的除了 extends奢讨、overridesroot 之外的其他任何有效配置選項稚叹,
  • 可以在單個覆蓋塊中提供多個 glob 模式焰薄。一個文件必須匹配至少一個配置中提供的模式。
  • 覆蓋塊也可以指定從匹配中排除的模式扒袖。如果一個文件匹配了任何一個排除模式塞茅,該配置將不再被應(yīng)用。

相對 glob 模式

project-root
├── app
│   ├── lib
│   │   ├── foo.js
│   │   ├── fooSpec.js
│   ├── components
│   │   ├── bar.js
│   │   ├── barSpec.js
│   ├── .eslintrc.json
├── server
│   ├── server.js
│   ├── serverSpec.js
├── .eslintrc.json

app/.eslintrc.json 文件中的配置定義了 glob 模式 **/*Spec.js季率。該模式是相對 app/.eslintrc.json 的基本目錄的野瘦。因此,該模式將匹配 app/lib/fooSpec.jsapp/components/barSpec.js不匹配 server/serverSpec.js。如果你在項目根目錄下的 .eslintrc.json 文件中定義了同樣的模式鞭光,它將匹配這三個 *Spec 文件吏廉。

配置示例

在你的 .eslintrc.json 文件中:

{
  "rules": {
    "quotes": [ 2, "double" ]
  },

  "overrides": [
    {
      "files": [ "bin/*.js", "lib/*.js" ],
      "excludedFiles": "*.test.js",
      "rules": {
        "quotes": [ 2, "single" ]
      }
    }
  ]
}

在配置文件中注釋

JSON 和 YAML 配置文件格式都支持注釋 ( package.json 文件不應(yīng)該包括注釋)。你可以在其他類型的文件中使用 JavaScript 風(fēng)格的注釋或使用 YAML 風(fēng)格的注釋惰许,ESLint 會忽略它們席覆。這允許你的配置更加人性化。例如:

{
    "env": {
        "browser": true
    },
    "rules": {
        // Override our default settings just for this directory
        "eqeqeq": "warn",
        "strict": "off"
    }
}

指定需要檢查的文件擴展名

目前汹买,告訴 ESLint 哪個文件擴展名要檢測的唯一方法是使用 --ext 命令行選項指定一個逗號分隔的擴展名列表佩伤。注意,該標(biāo)記只在與目錄一起使用時有效晦毙,如果使用文件名或 glob 模式生巡,它將會被忽略。

忽略文件和目錄

你可以通過在項目根目錄創(chuàng)建一個 .eslintignore 文件告訴 ESLint 去忽略特定的文件和目錄见妒。.eslintignore 文件是一個純文本文件孤荣,其中的每一行都是一個 glob 模式表明哪些路徑應(yīng)該忽略檢測。例如须揣,以下將忽略所有的 JavaScript 文件:

**/*.js

當(dāng) ESLint 運行時垃环,在確定哪些文件要檢測之前,它會在當(dāng)前工作目錄中查找一個 .eslintignore 文件返敬。如果發(fā)現(xiàn)了這個文件遂庄,當(dāng)遍歷目錄時,將會應(yīng)用這些偏好設(shè)置劲赠。一次只有一個 .eslintignore 文件會被使用涛目,所以,不是當(dāng)前工作目錄下的 .eslintignore 文件將不會被用到凛澎。

Globs 匹配使用 node-ignore霹肝,所以大量可用的特性有:

  • # 開頭的行被當(dāng)作注釋,不影響忽略模式塑煎。
  • 路徑是相對于 .eslintignore 的位置或當(dāng)前工作目錄沫换。這也會影響通過 --ignore-pattern傳遞的路徑。
  • 忽略模式同 .gitignore 規(guī)范
  • ! 開頭的行是否定模式最铁,它將會重新包含一個之前被忽略的模式讯赏。

除了 .eslintignore 文件中的模式,ESLint總是忽略 /node_modules/*/bower_components/* 中的文件冷尉。

例如:把下面 .eslintignore 文件放到當(dāng)前工作目錄里漱挎,將忽略 node_modulesbower_components 以及 build/ 目錄下除了 build/index.js 的所有文件雀哨。

# /node_modules/* and /bower_components/* ignored by default

# Ignore built files except build/index.js
build/*
!build/index.js

使用備用文件

如果相比于當(dāng)前工作目錄下 .eslintignore 文件磕谅,你更想使用一個不同的文件私爷,你可以在命令行使用 --ignore-path 選項指定它。例如膊夹,你可以使用 .jshintignore 文件衬浑,因為它有相同的格式:

eslint --ignore-path .jshintignore file.js

你也可以使用你的 .gitignore 文件:

eslint --ignore-path .gitignore file.js

任何文件只要滿足標(biāo)準(zhǔn)忽略文件格式都可以用。記住放刨,指定 --ignore-path 意味著任何現(xiàn)有的 .eslintignore 文件將不被使用嚎卫。請注意,.eslintignore 中的匹配規(guī)則比 .gitignore 中的更嚴(yán)格宏榕。

在 package.json 中使用 eslintConfig

{
  "name": "mypackage",
  "version": "0.0.1",
  "eslintConfig": {
      "env": {
          "browser": true,
          "node": true
      }
  },
  "eslintIgnore": ["hello.js", "world.js"]
}

忽略文件告警

當(dāng)您將目錄傳遞給 ESLint 時拓诸,文件和目錄將被忽略。如果將特定文件傳遞給ESLint麻昼,則會看到一條警告奠支,指示該文件已被跳過。例如抚芦,假設(shè)你有一個 .eslintignore 文件倍谜,如下所示:

foo.js

然后,您執(zhí)行:

eslint foo.js

您將會看到以下告警:

foo.js
  0:0  warning  File ignored because of your .eslintignore file. Use --no-ignore to override.

? 1 problem (0 errors, 1 warning)

發(fā)生此消息是因為ESLint不確定是否要檢查該文件叉抡。如消息所示尔崔,您可以使用 --no-ignore 省略使用忽略規(guī)則。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末褥民,一起剝皮案震驚了整個濱河市季春,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌消返,老刑警劉巖载弄,帶你破解...
    沈念sama閱讀 218,755評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異撵颊,居然都是意外死亡宇攻,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,305評論 3 395
  • 文/潘曉璐 我一進店門倡勇,熙熙樓的掌柜王于貴愁眉苦臉地迎上來逞刷,“玉大人,你說我怎么就攤上這事妻熊】淝常” “怎么了?”我有些...
    開封第一講書人閱讀 165,138評論 0 355
  • 文/不壞的土叔 我叫張陵固耘,是天一觀的道長题篷。 經(jīng)常有香客問我词身,道長厅目,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,791評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮损敷,結(jié)果婚禮上葫笼,老公的妹妹穿的比我還像新娘。我一直安慰自己拗馒,他們只是感情好路星,可當(dāng)我...
    茶點故事閱讀 67,794評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著诱桂,像睡著了一般洋丐。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上挥等,一...
    開封第一講書人閱讀 51,631評論 1 305
  • 那天友绝,我揣著相機與錄音,去河邊找鬼肝劲。 笑死迁客,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的辞槐。 我是一名探鬼主播掷漱,決...
    沈念sama閱讀 40,362評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼榄檬!你這毒婦竟也來了卜范?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,264評論 0 276
  • 序言:老撾萬榮一對情侶失蹤鹿榜,失蹤者是張志新(化名)和其女友劉穎先朦,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體犬缨,經(jīng)...
    沈念sama閱讀 45,724評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡喳魏,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了怀薛。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片刺彩。...
    茶點故事閱讀 40,040評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖枝恋,靈堂內(nèi)的尸體忽然破棺而出创倔,到底是詐尸還是另有隱情,我是刑警寧澤焚碌,帶...
    沈念sama閱讀 35,742評論 5 346
  • 正文 年R本政府宣布畦攘,位于F島的核電站,受9級特大地震影響十电,放射性物質(zhì)發(fā)生泄漏知押。R本人自食惡果不足惜叹螟,卻給世界環(huán)境...
    茶點故事閱讀 41,364評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望台盯。 院中可真熱鬧罢绽,春花似錦、人聲如沸静盅。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,944評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽蒿叠。三九已至明垢,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間市咽,已是汗流浹背袖外。 一陣腳步聲響...
    開封第一講書人閱讀 33,060評論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留魂务,地道東北人曼验。 一個月前我還...
    沈念sama閱讀 48,247評論 3 371
  • 正文 我出身青樓,卻偏偏與公主長得像粘姜,于是被迫代替她去往敵國和親鬓照。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,979評論 2 355

推薦閱讀更多精彩內(nèi)容