ESlint--代码规范和错误检查

官方地址:http://eslint.org/,中文地址:http://eslint.cn/

EsLint帮助我们检查Javascript编程时的语法错误。比如:在Javascript应用中,你很难找到你漏泄的变量或者方法。EsLint能够帮助我们分析JS代码,找到bug并确保一定程度的JS语法书写的正确性。在多人开发维护上,有利于团队开发风格保持一致,利于项目查看,维护。

EsLint提供以下几种校验:

1、语法错误校验;

2、不重要或丢失的标点符号,如分号;

3、没法运行到的代码块;

4、未被使用的参数提醒;

5、漏掉的结束符,如};

6、确保样式的统一规则,如sass或者less;

7、检查变量的命名;

安装

使用npm命令安装

// 如果项目中没有配置文件,通过npm init生成一个新的配置文件

npm init eslint -g

项目目录下,运行:eslint –init将会产生一个.eslintrc的文件,文件内容包含一些校验规则

//其中”semi”和”quotes”是规则名称。

{

    "rules": {

        "semi": ["error","always"],

        "quotes": ["error","double"]

    }

}

自定义配置

配置自己的规则,你可以关掉所有ESLint默认的验证,自行添加所确切需要的验证规则。为此EsLint提供了2个种方式进行设置:

Configuration Comments: 在所要验证的文件中,直接使用Javascript注释嵌套配置信息

Configuration Files: 使用JavaScript、JSON或YAML文件,比如.eslintrc文件,当然你也可以在package.json文件里添加eslintConfig字段,ESLint都会自动读取验证。

parserOptions

EsLint通过parserOptions,允许指定校验的ecma的版本,及ecma的一些特性

{

    "parserOptions": {

    "ecmaVersion": 6,//指定ECMAScript支持的版本,6为ES6

    "sourceType":"module",//指定来源的类型,有两种”script”或”module”

    "ecmaFeatures": {

            "jsx":true//启动JSX

        },

    }

}

Parser

EsLint默认使用esprima做脚本解析,当然你也切换他,比如切换成babel-eslint解析

{

    "parser":"esprima"//默认,可以设置成babel-eslint,支持jsx

}

Environments

Environment可以预设好的其他环境的全局变量,如brower、node环境变量、es6环境变量、mocha环境变量等

{

    "env": {

        "browser":true,

        "node":true

    }

}

//如果你想使用插件中的环境变量,你可以使用plugins指定,如下

{

    "plugins": ["example"],

    "env": {

        "example/custom":true

    }

}

Globals

指定你所要使用的全局变量,true代表允许重写、false代表不允许重写

{

    "globals": {

        "var1":true,

        "var2":false

    }

}

Plugins

EsLint允许使用第三方插件

{

    "plugins": [

        "react"

    ]

}

Rules

在配置文件中可以设置一些规则。

规则的错误等级有三种:

"off" 或者 0:关闭规则。

"warn" 或者 1:打开规则,并且作为一个警告(不影响exit code)。

"error" 或者 2:打开规则,并且作为一个错误(exit code将会是1)。

"extends": "eslint:recommended"

Extends是EsLint默认推荐的验证,你可以使用配置选择哪些校验是你所需要的。

自定义规则,一般格式:”规则名称”:error级别系数。

可以包括Strict模式、也可以是code的方式提醒,如符号等。还可以是第三方的校验,如react。

默认校验的地址:http://eslint.org/docs/rules/(英文),http://eslint.cn/docs/rules/(中文)

{

    "plugins": [

        "react"

    ],

    "rules": {

        //Javascript code 默认校验

        "eqeqeq":"off",//off = 0

        "curly":"error",//error = 2

        "quotes": ["warn","double"],//warn = 1

        //使用第三方插件的校验规则

        "react/jsx-quotes": 0

        }

}

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

推荐阅读更多精彩内容

  • ESLint 配置 ESlint 被设计为完全可配置的,这意味着你可以关闭每一个规则而只运行基本语法验证,或混合和...
    静默虚空阅读 41,251评论 3 14
  • EsLint入门学习整理 这两天因为公司要求,就对ESLint进行了初步的了解,网上的内容基本上都差不多,但是内容...
    点柈阅读 26,012评论 3 42
  • 两个月之前在项目中就开始使用 Eslint ,当时直接 copy 别人的 .eslintrc.js 文件,感觉好复...
    dkvirus阅读 111,923评论 33 190
  • GitChat技术杂谈 前言 本文较长,为了节省你的阅读时间,在文前列写作思路如下: 什么是 webpack,它要...
    萧玄辞阅读 12,681评论 7 110
  • ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项目。它的目标是提供一个插件化的...
    gavinDu阅读 1,792评论 1 1