eslint-config-vue,vue3 eslint配置
本文主要介绍了ESLint在Vue中的配置方式，具有很好的参考价值。希望对大家有帮助。如有错误或不足之处，请不吝赐教。
目录
说说vue项目中添加ESLint的规则。第一步：安装。第二步：配置。eslintrc文件。第三步：如图，你习惯了组内统一的代码风格。看着Vue项目的默认代码很别扭。记录ESLint的配置，以后直接复制粘贴。太美了。
https://eslint.org/docs/rules/,官方网站
ESLint配置方式
ESLint有三种配置方法。一般在自定义规则较少的情况下，选择第二个。自定义配置有很多，推荐第一种；第三种方法通常用于禁用特定代码的eslint。
1.通过eslintConfig在package.json中配置它，例如：
eslintConfig: {
root: true，
环境:{
node: true
},
扩展:[
插件：vue/essential ，
@ vue/标准
],
规则:{
eol-last: [0]，
Semi: [2， always]，//strong制语句结束分号。
Indent: [2，4]，//strong制缩进4个空格
No-new: [0]，//不允许在new实例之后进行赋值或比较。
不允许使用非调试器“:[0]，//调试器语句。
Camelcase: [0，{ properties : never }]//关闭驼峰命名规则
},
语法分析选项:{
分析器:巴别-埃斯林
}
},
eslintinignore :[
dist/*，
node_modules/*，
build/*，
*.md
],
2.通过的配置。eslintrc文件在项目的根目录下，它支持JSON和YAML语法。例如：
模块.导出={
根：没错，
解析器： babel-eslint ，//解析器，这里我们用babel-eslint
语法分析选项：{
source Type:“module”//Type是module，因为代码使用了ECMAScript模块。
},
环境：{
Browser: true，//预定义的全局变量，这里是浏览器环境
},
//https://github . com/fer OSS/standard/blob/master/rules . MD # JavaScript-standard-style
//extends: standard ，//extension，可以通过字符串或数组扩展规则。
lint *需要。vue文件
插件：[
Html //插件，用于识别文件中的js代码。它可以在没有MIME类型标识和脚本标签的情况下被识别，所以它被用于识别。vue文件。
],
//在此添加您的自定义规则
规则:{
//在此处编写自定义规则
}
}
3.它是通过注释在代码中配置的，注释的位置是有讲究的。示例：
//eslint-disable-next-line
设a=b；
设a=b；//eslint-disable-line
/* eslint-disable */
设a=b；
/* eslint-enable*/
规则级别
“关”或0:规则未启用。“警告”或1:违反时发出警告。“错误”或2:违反时会报告错误。
常用规则
规则:{
逗号-dangle: [error ， never]，//是否允许在对象中使用逗号结尾？
No-cond-assign :在条件语句的条件中不允许使用2，//赋值运算符。
No-console :不允许2，//Console语句。
No-constant-condition: 2，//在条件语句的条件中不允许常量。
No-control-regex :正则表达式中不允许使用2，//控制字符
“No-debugger”:不允许使用2，//Debugger语句。
No-dupe-args :函数定义中不允许有2，//重复的参数。
No-dupe-keys: 2，//对象中不允许有重复的键。
“no-duplicate-case”:2，在//switch语句中不允许重复的case标签。
No-empty: 2，//不允许空代码块。
No-empty-character-class: 2，//正则表达式中不允许空字符组。
No-ex-assign: 2，//不允许在try catch语句中重新分配异常变量
No-extra-boolean-cast: 2，//不允许不必要的布尔值转换。
No-extra-parens: 0，//不允许不必要的括号。
No-extra-semi: 2，//不允许不必要的分号。
No-func-assign: 2，//不允许重分发函数声明。
No-inner-declarations: [error ， functions]，//不允许在嵌套代码块中声明函数。
No-invalid-RegExp: 2，//RegExp构造函数中不允许无效的正则表达式。
wrap-life :[2， any]，//立即执行表达式的括号样式
Yoda: [2， never ，{except range: true}]，//在if条件中不允许使用Yoda条件。
Strict: [2，函数]，//使用严格模式
No-catch-shadow: 2，try catch语句接受的err变量不允许与外部变量同名。
No-delete-var: 2，//不允许删除运算符
No-label-var: 2，//不允许标签和变量同名。
No-shadow: 2，//外部作用域中的变量不能与其包含的作用域中的变量或参数同名。
No-shadow-restricted-names: 2，//js关键字和保留字不能用作函数名或变量名。
No-undef: 2，//不允许未声明的变量
No-undef-init: 2，//初始化时不允许给变量赋未定义的值
No-undefined: 2，//Undefined不允许用作标识符
No-unused-vars: [2，{vars: all ， args: after-used}]，//不允许使用声明后未使用的变量或参数。
No-use-before-define: [2， nofunc]，//在定义变量之前不允许使用变量。
Indent: 2，//strong制一致的缩进样式
大括号样式:[2， 1tbs ，{allowsingleline: false}]，//大括号样式
Camelcase: [2，{properties: never}]，//strong制驼峰命名规则
逗号样式:[2， last]，//逗号样式
Consistent-this: [0， self]，//获取当前环境的this时，风格一致。
Eol-last: 2，//文件以换行符结束。
“func-names”:0，//函数表达式必须有名称
Func-style: 0，//函数样式，规定只能使用函数声明或函数表达式。
Key-spacing: [2，{beforecolon: false， aftercolon: true}]，//对象的文字量中冒号前后的空格
Max-nested-callbacks: 0，//回调嵌套深度
New-cap: [2，{newiscap: true， cap is new: false}]，//构造函数名的第一个字母要大写。
“new-parens”:2，构造函数在//new时必须有括号
Newline-after-var: 0，//变数必须以空白行宣告。
“No-array-constructor”:不允许使用2，//数组构造函数。
“No-inline-comments”:不允许0，//inline注释
“No-lonely-if”:在else语句中不允许使用0，//Only if语句。
不允许混合空格和制表符:[2，智能制表符]，//不允许混合制表符和空格。
No-multiple-empty-lines: [2，{max: 2}]，//不超过两个空行。
“No-nested-terminal”:不允许使用2，//嵌套的三元运算符。
No-new-object: 2，//禁止使用new Object()
Fun-call-spacing: 2，//调用函数时，函数名和()之间不能有空格
“No-terminal”:不允许使用0，//三元运算符。
No-trailing-spaces: 2，//行尾不允许有空格。
no-underline-dangle :2，//标识符不允许以下划线开头。
No-extra-parens: 0，//不允许有多余的括号。
One-var: 0，//一起强制变量声明
Operator-assignment: 0，//赋值运算符的样式
Padded-blocks: [2， never]，//块中第一行的结尾是否为空。
Quote-props: 0，//属性名称用对象的文字量括起来。
引号:[1， single ， avoid-escape]，//引号样式
Semi: [2， always]，//strong制语句结束分号。
半空格:[2，{before: false， after: true}]，//分为前后空格。
Sort-vars: 0，//在声明变量时对它们进行排序
块前空格:[2，总是]，//块前的空格
space-before-function-paren :[2，{anonymous: always ， named: never}]，//定义函数时括号前的空格
Space-infix-ops: [2，{int32hint: true}]，//运算符周围的空格
Keyword-spacing: 2，//关键字前后的空格
Space-unary-ops: [2，{words: true， non words: false}]，//一元运算符前后不加空格。
Wrap-regex: 2，//正则表达式的文字量用括号括起来。
No-var: 0，//使用let和const而不是var
Generator-star-spacing: [2， both]，//生成器函数前后的空格
“max-depth”:0，//嵌套块深度
Max-len: 0，//以字符为单位的一行的最大长度。
Max-params: 0，//一个函数最多可以有多少个参数？
Max-statements: 0，//函数中最多有几个语句。
“No-bitwise”:不允许使用0，//位运算符。
“no-plus plus”:0//不允许使用-运算符。
}
说说Vue项目中添加ESLint的规则
自己配置脚手架时如何安装eslint语法规则，
第一步：安装
官方推荐的安装包如下
埃斯林特
eslint-配置-标准
eslint-插件-标准
eslint-插件-承诺
eslint-插件-导入
eslint-插件-节点
在安装一个
Eslint-plugin-html //用于标识vue中的html。注意5.0以上不好用。
第二步：配置.eslintrc文件
第三步：如图配置
- ext是指定要检测的文件。客户端/检测文件夹下哪些文件的手段。我这边的文件都写在客户端下面，所以客户端是写的。
那么运行npm run lint将会报告许多es语法错误。
我们可以设置一个lint-fix命令。
我们可以运行npm运行lint-fix来自动修复这些语法错误。
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。