ESLint 配置

ESLint 被设计为完全可配置的,这表示我们可以关闭每一个规则,而只运行基本语法验证,或混合和匹配 ESLint 默认绑定的规则和自定义规则,以让 ESLint 更适合我们的项目。

配置 ESLint有如下两种方式:

  • 配置注释:使用 JavaScript 注释将配置信息直接嵌入文件中。

  • 配置文件:使用 JavaScript,JSON 或 YAML 文件为整个目录及其所有子目录指定配置信息。可以配置一个独立的 .eslintrc.*文件,或者直接在 package.json 文件里的 eslintConfig 字段指定配置,ESLint 会查找和自动读取它们,也可以在命令行上指定配置文件。

配置文件

  • package.json文件配置:

一般每个项目下都有一而个package.json文件,这个文件定义了项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。可以手动创建这个文件或者直接使用npm init命令自动生成。npm install命令回根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。

  • .eslintrc文件配置:

然后我们可以开始创建配置文件.eslintrc,生成配置文件的命令如下所示:

$ eslint --init

如果我们选择的本地安装,那么则需要进入到node_modules/.bin目录来该执行命令:

$ cd node_modules/.bin
$ eslint --init
示例:

我们可以在终端中输入命令执行上述命令:

如图所示,会以问答的形式生成来配置文件,我们可以根据自己的需求来选择,出现如下图所示提示则表示文件创建成功:

生成的.eslintrc.js文件内容大致如下所示:

module.exports = {
    "env": {
        "browser": true,
        "es6": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:vue/essential"
    ],
    "globals": {
        "Atomics": "readonly",
        "SharedArrayBuffer": "readonly"
    },
    "parserOptions": {
        "ecmaVersion": 2018,
        "sourceType": "module"
    },
    "plugins": [
        "vue"
    ],
    "rules": {
    }
};

文件中有如下几个配置项:

  • env:指定代码运行的宿主环境。

  • extends:指定 eslint 规范。

  • globals:声明在代码中的自定义全局变量。

  • parserOptions:设置解析器选项。

  • plugins:引用第三方的插件。

  • rules:启用额外的规则或覆盖默认的规则。

运行ESLint

配置文件创建成功后,我们可以使用ESLint命令来测试文件。注意要在.bin目录下,执行eslint命令:

$ cd node_modules/.bin
$ eslint filename.js

其中filename.js就是需要测试的文件名,记得要在.bin目录下运行eslint命令。

示例:

例如我们创建一个用于测试的add.js文件,文件内容如下所示:

function add(i) {
  if (i != NaN) {
      return i ++
  } else {
    return
  }
};

然后在终端中执行eslint add.js,可以看到输出 3个错误:

例如第一个错误no-unused-vars表示禁止使用未使用的变量。第二个错误use-isnan表示在在检查“NaN”时需要调用isNaN()。第三个错误no-extra-semi表示不允许不必要的分号。

配置文件格式

ESLint 支持几种格式的配置文件:

  • JavaScript:使用 .eslintrc.js 然后输出一个配置对象。

  • YAML:使用 .eslintrc.yaml.eslintrc.yml 去定义配置的结构。

  • JSON:使用 .eslintrc.json 去定义配置的结构,ESLint 的 JSON 文件允许 JavaScript 风格的注释。

  • package.json:在 package.json 里创建一个 eslintConfig属性,在那里定义你的配置。

如果同一个目录下有多个配置文件,ESLint 只会使用一个。优先级顺序如下:

.eslintrc.js
.eslintrc.yaml
.eslintrc.yml
.eslintrc.json
.eslintrc
package.json  

链接:https://www.9xkd.com/

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,294评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,780评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,001评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,593评论 1 289
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,687评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,679评论 1 294
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,667评论 3 415
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,426评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,872评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,180评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,346评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,019评论 5 340
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,658评论 3 323
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,268评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,495评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,275评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,207评论 2 352

推荐阅读更多精彩内容