ESlint如何配置_学习_eslint配置文件详解

ESLint - 配置介绍

官方地址:http://eslint.org/

中文地址:http://eslint.cn/

ESLint最初是由Nicholas C. Zakas 于年6月创建的开源项目。它的目标是提供一个插件化的javascript代码检测工具。

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
        }
}
原文链接:,转发请注明来源!