eslintrc.js配置文件详解及参考文档
Posted 十九万里
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了eslintrc.js配置文件详解及参考文档相关的知识，希望对你有一定的参考价值。
公司最近引入vue框架，跟着视频学习eslint配置规则，特将项目使用配置及其结合网上资料做了整理，当做笔记，并行希望能帮助到其他人。
一.eslint配置文件主要作用
[1]检测代码合法性(javascript、JSX、ES6、html、JSDoc、posts、vue、React、AngularJS、React Native、mocha)
[2]代码格式化(按照eslint配置文件的规范设置)
二.eslint参考文档
[1]英文版：https://eslint.org/docs/user-guide/configuring
[2]中文版：http://eslint.cn/docs/rules/
三.其他标准参考文档：
[1]标准js语法规则：https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
[2]import插件规则:https://github.com/benmosher/eslint-plugin-import
四.其他参考文档(在此表示感谢)：
[1]rule常用规则实例：https://blog.csdn.net/weixin_38606332/article/details/80864381
[2]eslint配置详细介绍：https://blog.csdn.net/q3254421/article/details/86477502
五.实例解析：
module.exports = {
root: true, //指定配置文件根目录：表示当前文件为eslint的根配置文件，逐层查找时无需往更上一级的文件目录中进行搜索
parser: 'babel-eslint',//指定eslint解析器：babel-eslint是围绕Babel解析器的包装器使其与ESLint兼容；可能值espree、esprima
parserOptions: { //eslint解析器配置项
sourceType: "module",//指定js的导入方式，module是指通过模块导入，默认值为script(表示通过script标签引入)
},
env: { //运行环境极其局全局变量
browser: true, //浏览器环境
},
plugins: [//提供插件
'html' //插件名称，省略了[eslint-plugin-]前缀，表示规范html
],
extends: 'airbnb-base', //规则继承：airbnb-base包含了JS、Es6的语法检查要依赖于[eslint-pugin-import]；另一个值standard表示使用标准的js语法规则
settings: { //添加共享规则参数,会提供给每一个规则，但是规则使不使用，看规则的设置
'import/resolver': {
webpack: { //解析webpack配置项，路径为bulid/webpack.base.conf.js
config: 'bulid/webpack.base.conf.js'
}
}
},
/* 自定义规则
* 单条规则语法："规则名称":[规则值，规则配置] 或者 "规则名称":值
* 基本规则值：off/0:关闭规则(不满足规则也不会提醒或者抛出异常)； warn/1:开启警告规则(若不满足规则不会影响代码)； error/2:开启错误规则(若不满足规则会退出代码)
*/
rule: { //具体规则
/* XXX/AAA: 表示xxx插件自定义的规则，省略了[eslint-plugin]前缀*/
'import/extension': ['error','always',{ //是[eslint-plugin-import]自定义规则
js: 'never',
vue: 'never',
}],
'import/no-extraneous-dependencies': ['error',{
optionalDependencies:['test/unit/index.js']
}],
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, //生产环境禁止使用debug模式
'no-empty': 2, //禁止出现空语句块
'generator-start-spacing': 0, //生成器函数*的前后空格
'indent': 0, //缩进配置，0表示使用编辑器自带的格式化缩进
'semi': ['error','always'], //语句强制分号，若没有分号则报错
'space-before-function-parent': 0, //在function和()之间不需要预留空格
}
}
以上是关于eslintrc.js配置文件详解及参考文档的主要内容，如果未能解决你的问题，请参考以下文章
vue-cli中的ESlint配置文件eslintrc.js详解