怎么在vue项目中添加一个ESLint

　　介绍

怎么在vue项目中添加一个ESLint ?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

<强> ESLint配置方式有两种:

1。注释配置:使用js注释来直接嵌入ESLint配置信息到一个文件里

2。配置文件:使用一个js, JSON或者YAML文件来给整个目录和它的子目录指定配置信息。这些配置可以写在一个文件名为.eslintrc。*的文件或者在package.json文件里的eslintConfig项里,这两种方式ESLint都会自动寻找然后读取,或者你也可以在命令行里指定一个配置文件。

有几种东西是可以配置的:

<李>

环境:你的脚本会在哪种环境下运行。每个环境带来了一组特定的预定义的全局变量。

<李>

全局变量:脚本运行期间会访问额外的全局变量。

<李>

规则:使用那些规则,并且规则的等级是多少。

我们这里使用配置文件.eslintrc.js来配置,它导出一个模块供ESLint识别。

//, http://eslint.org/docs/user-guide/configuring 　　 　　module.exports =, { 　　,根:没错, 　　,解析器:& # 39;babel-eslint& # 39;//解析器,这里我们使用babel-eslint 　　,parserOptions: { 　　sourceType才能:& # 39;模块# 39;//类型为模块,因为代码使用了使用了ECMAScript模块 　　}, 　　,env: { 　　浏览器才能:真的,//预定义的全局变量,这里是浏览器环境 　　}, 　　,//https://github.com/feross/standard/blob/master/RULES.md javascript-standard-style//扩展:大敌;& # 39;标准# 39;,,//扩展,可以通过字符串或者一个数组来扩展规则 　　,//required 用lint  * .vue 文件 　　,插件:[ 　　& # 39;才能html # 39;,//插件,此插件用于识别文件中的js代码,没有MIME类型标识没有脚本标签也可以识别到,因此拿来识别.vue文件中的js代码 　　,), 　　,//add  your  custom  rules 这里 　　,& # 39;规则# 39;:,{//这才能里写自定义规则 　　,} 　　}

ESLint的规则有三种级别:

<李>

“off"或者0,不启用这个规则

<李>

“warn"或者1,出现问题会有警告

<李>

“error"或者2,出现问题会报错

有时候代码里有些特殊情况需要我们在某一行或者某几行关闭ESLint检测,可以使用注释:

下面的代码会关闭所有规则

/*, eslint-disable  */警报(& # 39;foo # 39;);/*,eslint-enable  */

下面的代码会关闭某一行的所有规则

警报(& # 39;foo # 39;);,//eslint-disable-line//eslint-disable-next-line 　　警报(& # 39;foo # 39;);

下面的代码在某一行关闭指定的规则

警报(& # 39;foo # 39;);,//eslint-disable-line  no-alert//eslint-disable-next-line  no-alert 　　警报(& # 39;foo # 39;);

常用规则:

规则的细节请到ESLint官方网站查看http://eslint.org/docs/rules/

& # 39;规则# 39;:,{ 　　,才能“comma-dangle":, (“error",,“never"],,//是否允许对象中出现结尾逗号 　　,才能“no-cond-assign":,,,//条件语句的条件中不允许出现赋值运算符 　　,才能“no-console":,,,//不允许出现控制台语句 　　,才能“no-constant-condition":,,,//条件语句的条件中不允许出现恒定不变的量 　　,才能“no-control-regex":,,,//正则表达式中不允许出现控制字符 　　,才能“no-debugger":,,,//不允许出现调试器语句 　　,才能“no-dupe-args":,,,//函数定义的时候不允许出现重复的参数 　　,才能“no-dupe-keys":,,,//对象中不允许出现重复的键 　　,才能“no-duplicate-case":,,,//开关语句中不允许出现重复的情况下标签 　　,才能“no-empty":,,,//不允许出现空的代码块 　　,才能“no-empty-character-class":,,,//正则表达式中不允许出现空的字符组 　　,才能“no-ex-assign":,,,//在try 抓住语句中不允许重新分配异常变量 　　,才能“no-extra-boolean-cast":,,,//不允许出现不必要的布尔值转换 　　,才能“no-extra-parens":, 0,,//不允许出现不必要的圆括号 　　,才能“no-extra-semi":,,,//不允许出现不必要的分号 　　,才能“no-func-assign":,,,//不允许重新分配函数声明 　　,才能“no-inner-declarations":, (“error",,“functions"],,//不允许在嵌套代码块里声明函数 　　,才能“no-invalid-regexp":,,,//不允许在RegExp构造函数里出现无效的正则表达式 　　,才能“no-irregular-whitespace":,,,//不允许出现不规则的空格 　　,才能“no-negated-in-lhs":,,,//不允许在在表达式语句中对最左边的运算数使用取反操作 　　,才能“no-obj-calls":,,,//不允许把全局对象属性当做函数来调用 　　,才能“no-regex-spaces":,,,//正则表达式中不允许出现多个连续空格 　　,才能“quote-props":,,,//对象中的属性名是否需要用引号引起来 　　,才能“no-sparse-arrays":,,,//数组中不允许出现空位置 　　,才能“no-unreachable":,,,//在回来,扔,继续,打破语句后不允许出现不可能到达的语句 　　,才能“use-isnan":,,,//要求检查南的时候使用isNaN () 　　,才能“valid-jsdoc":, (“error",, { 　　,,,,“requireReturn":,假的, 　　,,,,“requireParamDescription":,假的, 　　,,,,“requireReturnDescription":真实 　　,,},,//强制JSDoc注释 　　,才能“valid-typeof":, (“error",, { 　　,,,,“requireStringLiterals":真实 　　,,},,//在使用typeof表达式比较的时候强制使用有效的字符串 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null

怎么在vue项目中添加一个ESLint