vue中eslintrc.js最详细的介绍了

/**

* 参考文档

* 【eslint英文文档】https://eslint.org/docs/user-guide/configuring

* 【eslint中文文档】http://eslint.cn/docs/rules/

*/

/**

* eslint有三种使用方式

* 【1】js代码中通过注释的方式使用

* 【2】通过webpack的eslintConfig字段设置,eslint会自动搜索项目的package.json文件中的配置

* 【3】通过配置文件的方式使用,配置文件有多种文件方式,如JavaScript、JSON 或者 YAML等

*/

/**

* 文件忽略

* 【】让eslint跳过特定文件的检测

* 【】通过当前工作目录下 「.eslintignore」 文件进行设置

*    其使用的是Glob路径书写方式,与「.gitignore」的使用方法相同

* 【】也可以在 package.json 文件中,通过 eslintIgnore 参数进行设置

*/

/**

* 文件内局部设置

* 【】eslint可以具体文件中设置特定代码的规则,常用于跳过某条语句的检测。

* 【】注销全部规则,在代码前新建一行,添加注销 /* eslint-disable *\/  。如果没有恢复设置的语句,则下列全部代码都会跳过检测。

* 【】恢复eslint,在代码前新建一行,添加注销 /* eslint-enable *\/

* 【】指定忽略的规则,/* eslint-disable no-alert, no-console *\/

* 【】在特定行禁用,// eslint-disable-line

* 【】在下一行禁用,// eslint-disable-next-line

*/

module.exports = {

  /**

  * 根目录标识

  *  http://eslint.cn/docs/user-guide/configuring#using-configuration-files

  *  http://eslint.cn/docs/user-guide/configuring#configuration-cascading-and-hierarchy

  * 【】标识当前配置文件为最底层的文件,无需往更上一级的文件目录中进行搜索

  * 【】默认eslint的配置文件搜索方式是,从目标文件夹进行搜索,遍历内部每一个文件夹,找到配置文件并层叠使用。再跳出本项目,往祖先文件夹进行遍历

  * 【】注意「~/.eslintrc」的意义,「~」是指linux上的家目录,「~/.eslintrc」是指家目录下的eslint配置文件,用于私人开发者,用于整个电脑全局约束的。这个配置通过本配置项root去设置,设置了root,eslint检测时将不会再往上搜索

  * 【】eslint的生效规则是就近使用,越近的配置项优先级越高,覆盖其他配置项。如一个项目中,可以在不同文件夹中都添加配置文件,这些规则将重叠组合生效

  */

  root: true, // 标识当前配置文件为eslint的根配置文件,让其停止在父级目录中继续寻找。

  /**

  * 解析器

  *  http://eslint.cn/docs/user-guide/configuring#specifying-parser

  * 【】ESLint 默认使用Espree作为其解析器

  * 【】解析器必须是本地安装的一个 npm 模块。即必须按照在本地的node_module中

  * 【】解析器是用于解析js代码的,怎么去理解每一个表达式,有点C++中编译器的概念,会对js进行一些语法分析,语义分析什么的,才能判断语句符不符合规范。而不是通过简单的字符串对比。

  * 【】解析器有很多,但兼容eslint的解析器有以下几个

  *  Espree:默认解析器,一个从Esprima中分离出来的解析器,做了一些优化

  *  Esprima:js标准解析器

  *  Babel-ESLint: 一个对Babel解析器的包装,babel本身也是js解析器的一种(不然怎么能转化为兼容性代码呢?首先需要进行js解析,才能转化)。如果我们的代码需要经过babel转化,则对应使用这个解析器

  *  typescript-eslint-parser(实验) - 一个把 TypeScript 转换为 ESTree 兼容格式的解析器

  * 【】但是通常在vue项目中,并不会写在 parser 字段中,而是写在 parserOptions -> parser。具体原因在 parserOptions 一栏中介绍

  */

  // parser: 'babel-eslint',

  /**

  * 解析器配置项

  *  http://eslint.cn/docs/user-guide/configuring#specifying-parser-options

  * 【】这里设置的配置项将会传递到解析器中,被解析器获取到,进行一定的处理。具体被利用到,要看解析器的源码有没有对其进行利用。这里仅仅做了参数定义,做了规定,告诉解析器的开发者可能有这些参数

  * 【】配置项目有:

  * "sourceType": "module",    // 指定JS代码来源的类型,script(script标签引入?) | module(es6的module模块),默认为script。为什么vue的会使用script呢?因为vue是通过babel-loader编译的,而babel编译后的代码就是script方式

  * "ecmaVersion": 6,          // 支持的ES语法版本,默认为5。注意只是语法,不包括ES的全局变量。全局变量需要在env选项中进行定义

  * "ecmaFeatures": {          // Features是特征的意思,这里用于指定要使用其他那些语言对象

      "experimentalObjectRestSpread": true,  //启用对对象的扩展

      "jsx": true,                          //启用jsx语法

      "globalReturn":true,                  //允许return在全局使用

      "impliedStrict":true                  //启用严格校验模式

    }

  */

  parserOptions: {

    /**

    * 这里出现 parser 的原因

    * 【】首先明确一点,官方说明中,parserOptions的配置参数是不包括 parser 的

    * 【】这里的写 parser 是 eslint-plugin-vue 的要求,是 eslint-plugin-vue 的自定义参数

    * 【】根据官方文档,eslint-plugin-vue 插件依赖 「vue-eslint-parser」解析器。「vue-eslint-parser」解析器,只解析 .vue 中html部分的内容,不会检测

你可能感兴趣的:(vue中eslintrc.js最详细的介绍了)