- 1. Eslint配置指南
- 1.1. 安装 ESLint
- 1.2. 生成配置文件
- 1.3. 修改配置文件
- 1.4. 创建
.eslintignore文件 - 1.5. 运行 ESLint
- 1.6. 整合到编辑器/IDE
- 1.7. 自动修复
- 2. 配置prettier
- 2.1. 安装依赖包
- 2.2. .prettierrc.json添加规则
- 2.3. .prettierignore忽略文件
- 2.4. 保存自动格式化
- 3. eslint-config-win
- 3.1. 安装
- 3.2. 依赖版本
- 3.3. 用法
- 3.3.1. Vue
- 3.4. Vue3 新增规则
- 3.5. 参考
- 3.6. 开发维护
- 4. eslint配置举例
1. Eslint配置指南
ESLint 是一个强大的代码检查工具，用于识别 JavaScript 和其他支持的语言中的常见编程错误，并强制执行一致的编码风格。
ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项目。
ESLint 是一个开源的 JavaScript 代码检查工具，它是用来进行代码的校验，检测代码中潜在的问题，比如某个变量定义了未使用、函数定义的参数重复、变量名没有按规范命名等等。
中文官网：https://zh-hans.eslint.org/
英文官网：https://eslint.org/
下面是一个基本的 ESLint 配置指南，帮助你开始使用它来提升代码质量。
1.1. 安装 ESLint
首先，你需要在项目中安装 ESLint。如果你的项目是一个 Node.js 应用，通常会将其作为开发依赖安装：
npm install eslint --save-dev
// 或者使用 yarn
yarn add eslint --dev
1.2. 生成配置文件
ESLint 支持多种格式的配置文件，包括 .eslintrc.js, .eslintrc.yaml, .eslintrc.yml, .eslintrc.json, 以及直接在 package.json 中的 "eslintConfig" 字段。你可以根据需要选择合适的格式。
要生成配置文件，可以运行：
npx eslint --init
这会引导你进行一系列问题的回答，根据你的回答自动生成配置。
例如，你可以选择你的环境（浏览器、Node.js等）、想要遵循的编码规范（如 Airbnb、Google、Standard等）以及是否要支持某些语言特性（比如 Vue.js 或 React）。
1.3. 修改配置文件
生成的 .eslintrc.* 文件包含了 ESLint 的基础配置。你可以手动编辑这个文件来调整规则，添加或移除规则，或改变规则的严格程度。配置文件通常看起来像这样：
// .eslintrc.js 示例
// @see https://eslint.bootcss.com/docs/rules/module.exports = {env: {browser: true,es2021: true,node: true,jest: true,},/* 指定如何解析语法 */parser: 'vue-eslint-parser',/** 优先级低于 parse 的语法解析配置 */parserOptions: {ecmaVersion: 'latest',sourceType: 'module',parser: '@typescript-eslint/parser',jsxPragma: 'React',ecmaFeatures: {jsx: true,},},/* 继承已有的规则 */extends: ['eslint:recommended','plugin:vue/vue3-essential','plugin:@typescript-eslint/recommended','plugin:prettier/recommended',],plugins: ['vue', '@typescript-eslint'],/** "off" 或 0 ==> 关闭规则* "warn" 或 1 ==> 打开的规则作为警告（不影响代码执行）* "error" 或 2 ==> 规则作为一个错误（代码不能执行，界面报错）*/rules: {// eslint（https://eslint.bootcss.com/docs/rules/）'no-var': 'error', // 要求使用 let 或 const 而不是 var'no-multiple-empty-lines': ['warn', { max: 1 }], // 不允许多个空行'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off','no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off','no-unexpected-multiline': 'error', // 禁止空余的多行'no-useless-escape': 'off', // 禁止不必要的转义字符// typeScript (https://typescript-eslint.io/rules)'@typescript-eslint/no-unused-vars': 'error', // 禁止定义未使用的变量'@typescript-eslint/prefer-ts-expect-error': 'error', // 禁止使用 @ts-ignore'@typescript-eslint/no-explicit-any': 'off', // 禁止使用 any 类型'@typescript-eslint/no-non-null-assertion': 'off','@typescript-eslint/no-namespace': 'off', // 禁止使用自定义 TypeScript 模块和命名空间。'@typescript-eslint/semi': 'off',// eslint-plugin-vue (https://eslint.vuejs.org/rules/)'vue/multi-word-component-names': 'off', // 要求组件名称始终为 “-” 链接的单词'vue/script-setup-uses-vars': 'error', // 防止<script setup>使用的变量<template>被标记为未使用'vue/no-mutating-props': 'off', // 不允许组件 prop的改变'vue/attribute-hyphenation': 'off', // 对模板中的自定义组件强制执行属性命名样式},
}
1.4. 创建 .eslintignore 文件
你可以创建一个 .eslintignore 文件来指定 ESLint 应该忽略哪些文件或目录。这与 .gitignore 类似，每一行一个路径模式。
例如：
/node_modules/
/dist/
/build/
1.5. 运行 ESLint
安装并配置好后，可以在命令行中运行 ESLint 来检查你的代码：
npx eslint yourfile.js
// 或者检查整个项目
npx eslint .
1.6. 整合到编辑器/IDE
大多数现代代码编辑器（如 VSCode, WebStorm等）都支持 ESLint 插件，允许你在编写代码时实时看到 ESLint 的警告和错误，并提供快速修复选项。确保安装对应的插件并启用它。
1.7. 自动修复
ESLint 提供了一个自动修复功能，可以尝试修复一些简单的警告和错误：
npx eslint --fix yourfile.js
// 或者修复整个项目
npx eslint --fix .
package.json新增两个运行脚本
"scripts": {"lint": "eslint src","fix": "eslint src --fix",
}
以上就是 ESLint 的基本配置指南。随着项目的进展，你可能需要根据团队的编码规范进一步定制配置。记得定期更新 ESLint 及其插件以获取最新的规则和支持。
更多详细内容，请微信搜索“前端爱好者“， 戳我 查看 。
2. 配置prettier
有了eslint，为什么还要有prettier？
eslint针对的是javascript，他是一个检测工具，包含js语法以及少部分格式问题，在eslint看来，语法对了就能保证代码正常运行，格式问题属于其次；
而prettier属于格式化工具，它看不惯格式不统一，所以它就把eslint没干好的事接着干，另外，prettier支持包含js在内的多种语言。
总结起来，eslint和prettier这俩兄弟一个保证js代码质量，一个保证代码美观。
来到VS Code安装其对应的插件。
2.1. 安装依赖包
npm install -D eslint-plugin-prettier prettier eslint-config-prettier
yarn add -D eslint-plugin-prettier prettier eslint-config-prettier
pnpm install -D eslint-plugin-prettier prettier eslint-config-prettier
同样是在src同级目录下安装.prettierrc.json文件夹
2.2. .prettierrc.json添加规则
{"printWidth": 120, "tabWidth": 2, "useTabs": false, "semi": false, "singleQuote": true,"bracketSpacing": true,"trailingComma": "all", "jsxSingleQuote": false, "arrowParens": "avoid","proseWrap": "preserve","htmlWhitespaceSensitivity": "strict", "endOfLine": "auto"
}
2.3. .prettierignore忽略文件
/dist/*
/html/*
.local
/node_modules/**
**/*.svg
**/*.sh
/public/*
通过pnpm run lint去检测语法，如果出现不规范格式,通过pnpm run fix 修改
2.4. 保存自动格式化
想要按 Ctrl+S 保证的自动按eslint规则格式化代码的话，找到 .vscode 文件，内部新建个 setting.json 文件夹
setting.json 写入代码
{"editor.formatOnType": true,
"editor.formatOnSave": true,
"eslint.codeAction.showDocumentation": {"enable": true
},
"editor.codeActionsOnSave": {"source.fixAll.eslint": true
},
"eslint.validate": ["javascript", "javascriptreact", "html", "vue"]
}
3. eslint-config-win
此规则适用于 JavaScript/Vue 项目的 ESLint 配置规范。
目前已支持 Vue 3.0，需要指定 extends 配置vue3
https://gitee.com/braden/eslint-config-win?spm=5176.28575747.0.0.ff1f2adcn7ydP7
3.1. 安装
yarn add @winner-fed/eslint-config-win -D
3.2. 依赖版本
eslint ^7.32.0
@babel/eslint-parser ^7.15.8
vue-eslint-parser ^7.11.0
eslint-plugin-vue ^7.20.0
Tips：如果项目中没有安装此依赖包或者版本不一致，请安装或者升级。
3.3. 用法
- 在你的项目的根目录下创建一个
.eslintrc.js文件，并将以下内容复制进去：
module.exports = {extends: ['@winner-fed/win',],env: {// 你的环境变量（包含多个预定义的全局变量）//// browser: true,// node: true,// mocha: true,// jest: true,// jquery: true},globals: {// 你的全局变量（设置为 false 表示它不允许被重新赋值）//// myGlobal: false},rules: {// 自定义你的规则}
};
- 项目目录下的
package.json添加检测指令，举个例子
{..."scripts": {
+ "lint:es": "eslint \"src/**/*.{vue,js,jsx}\" --fix",}...
}
3.3.1. Vue
npm install --save-dev eslint babel-eslint vue-eslint-parser eslint-plugin-vue @winner-fed/eslint-config-win
在你的项目的根目录下创建一个 .eslintrc.js 文件，并将以下内容复制进去：
module.exports = {extends: ['@winner-fed/win',// 这里是针对 vue2 的配置'@winner-fed/win/vue', // 如果是 vue3 的项目工程，则推荐下面配置// '@winner-fed/win/vue3',],env: {// 你的环境变量（包含多个预定义的全局变量）//// browser: true,// node: true,// mocha: true,// jest: true,// jquery: true},globals: {// 你的全局变量（设置为 false 表示它不允许被重新赋值）//// myGlobal: false},rules: {// 自定义你的规则}
};
3.4. Vue3 新增规则
| rule | 规则描述 |
|---|---|
| vue/custom-event-name-casing | 自定义事件名必须用 kebab-case 风格 |
| vue/no-arrow-functions-in-watch | watch 中禁止使用箭头函数 |
| vue/no-custom-modifiers-on-v-model | 禁止自定义的 v-modal 修饰语 |
| vue/no-deprecated-data-object-declaration | 禁止在 data 中使用已废弃的对象定义 |
| vue/no-deprecated-destroyed-lifecycle | 禁止使用已废弃的 destroyed 和 beforeDestroy 生命周期 |
| vue/no-deprecated-dollar-listeners-api | 禁止使用已废弃的 $listeners |
| vue/no-deprecated-dollar-scopedslots-api | 禁止使用已废弃的 $scopedSlots |
| vue/no-deprecated-events-api | 禁止使用已废弃的 events 接口 |
| vue/no-deprecated-filter | 禁止使用已废弃的 filters 语法 |
| vue/no-deprecated-functional-template | 禁止使用已废弃的 functional 模版 |
| vue/no-deprecated-html-element-is | 禁止使用已废弃的 is 属性 |
| vue/no-deprecated-inline-template | 禁止使用已废弃的 inline-template 属性 |
| vue/no-deprecated-props-default-this | 禁止使用已废弃的 this |
| vue/no-deprecated-v-bind-sync | 禁止在 v-bind 指令中使用已废弃的 .sync 修饰符 |
| vue/no-deprecated-v-on-native-modifier | 禁止使用已废弃的 .native 修饰符 |
| vue/no-deprecated-v-on-number-modifiers | 禁止使用已废弃的数字修饰符 |
| vue/no-deprecated-vue-config-keycodes | 禁止使用已废弃的 Vue.config.keyCodes |
| vue/no-dupe-v-else-if | 禁止在 v-if 和 v-else-if 中出现重复的测试表达式 |
| vue/no-duplicate-attr-inheritance | 使用 v-bind=“$attrs” 时 inheritAttrs 必须是 false |
| vue/no-empty-component-block | 禁止 <template> <script> <style> 为空 |
| vue/no-invalid-model-keys | 禁止 model 中出现错误的属性 |
| vue/no-lifecycle-after-await | 禁止异步注册生命周期 |
| vue/no-lone-template | 禁止出现没必要的 <template> |
| vue/no-multiple-objects-in-class | 禁止 class 中出现复数的对象 |
| vue/no-multiple-slot-args | 禁止给 scoped slots 传递多个参数 |
| vue/no-multiple-template-root | 禁止模版中有多个根节点 |
| vue/no-mutating-props | 禁止修改组件的 props |
| vue/no-ref-as-operand | 禁止直接使用由 ref 生成的变量，必须使用它的 value |
| vue/no-setup-props-destructure | 禁止对 setup 中的 props 解构 |
| vue/no-sparse-arrays | 禁止在数组中出现连续的逗号 |
| vue/no-useless-concat | 禁止没必要的字符拼接 |
| vue/no-useless-mustaches | 禁止出现无用的 mustache 字符串 |
| vue/no-useless-v-bind | 禁止出现无用的 v-bind |
| vue/no-v-for-template-key | 禁止 template 有 v-for 属性时又有 key 属性 |
| vue/no-v-for-template-key-on-child | 禁止 template v-for 属性的子节点有 key 属性 |
| vue/no-watch-after-await | 禁止在 await 之后调用 watch |
| vue/one-component-per-file | 一个文件必须仅包含一个组件 |
| vue/order-in-components | 组件的属性必须为一定的顺序 |
| vue/require-explicit-emits | emits 属性必须包含 $emit() 中的值 |
| vue/require-slots-as-functions | this.$slots.default 必须被当作方法使用 |
| vue/require-toggle-inside-transition | transition 内部必须有条件指令 |
| vue/return-in-emits-validator | emits 中的方法必须有返回值 |
| vue/v-on-event-hyphenation | 禁止在 v-on 的事件名使用横杠 |
| vue/valid-v-is | v-is 指令必须合法 |
3.5. 参考
- ESlint Code Guide
- ESlint Shareable Config
- eslint-config-alloy
3.6. 开发维护
- 以测试开发驱动，config/rules/*.json 文件都是根据 test/ 文件夹对应的生成的
4. eslint配置举例
{
"rules" : {// 定义对象的set存取器属性时，强制定义get"accessor-pairs": 2,// 指定数组的元素之间要以空格隔开(,后面)， never参数：[ 之前和 ] 之后不能带空格，always参数：[ 之前和 ] 之后必须带空格"array-bracket-spacing": [2, "never"],// 在块级作用域外访问块内定义的变量是否报错提示"block-scoped-var": 0,// if while function 后面的{必须与if在同一行，java风格。"brace-style": [2, "1tbs", { "allowSingleLine": true }],// 双峰驼命名格式"camelcase": 2,// 数组和对象键值对最后一个逗号， never参数：不能带末尾的逗号, always参数：必须带末尾的逗号，// always-multiline：多行模式必须带逗号，单行模式不能带逗号"comma-dangle": [2, "never"],// 控制逗号前后的空格"comma-spacing": [2, { "before": false, "after": true }],// 控制逗号在行尾出现还是在行首出现// http://eslint.org/docs/rules/comma-style"comma-style": [2, "last"],// 圈复杂度"complexity": [2,9],// 以方括号取对象属性时，[ 后面和 ] 前面是否需要空格, 可选参数 never, always"computed-property-spacing": [2,"never"],// 强制方法必须返回值，TypeScript强类型，不配置"consistent-return": 0,// 用于指统一在回调函数中指向this的变量名，箭头函数中的this已经可以指向外层调用者，应该没卵用了// e.g [0,"that"] 指定只能 var that = this. that不能指向其他任何值，this也不能赋值给that以外的其他值"consistent-this": 0,// 强制在子类构造函数中用super()调用父类构造函数，TypeScrip的编译器也会提示"constructor-super": 0,// if else while for do后面的代码块是否需要{ }包围，参数：// multi 只有块中有多行语句时才需要{ }包围// multi-line 只有块中有多行语句时才需要{ }包围, 但是块中的执行语句只有一行时，// 块中的语句只能跟和if语句在同一行。if (foo) foo++; else doSomething();// multi-or-nest 只有块中有多行语句时才需要{ }包围, 如果块中的执行语句只有一行，执行语句可以零另起一行也可以跟在if语句后面// [2, "multi", "consistent"] 保持前后语句的{ }一致// default: [2, "all"] 全都需要{ }包围"curly": [2, "all"],// switch语句强制default分支，也可添加 // no default 注释取消此次警告"default-case": 2,// 强制object.key 中 . 的位置，参数:// property，'.'号应与属性在同一行// object, '.' 号应与对象名在同一行"dot-location": [2, "property"],// 强制使用.号取属性// 参数： allowKeywords：true 使用保留字做属性名时，只能使用.方式取属性// false 使用保留字做属性名时, 只能使用[]方式取属性 e.g [2, {"allowKeywords": false}]// allowPattern: 当属性名匹配提供的正则表达式时，允许使用[]方式取值,否则只能用.号取值 e.g [2, {"allowPattern": "^[a-z]+(_[a-z]+)+$"}]"dot-notation": [2, {"allowKeywords": true}],// 文件末尾强制换行"eol-last": 2,// 使用 === 替代 =="eqeqeq": [2, "allow-null"],// 方法表达式是否需要命名"func-names": 0,// 方法定义风格，参数：// declaration: 强制使用方法声明的方式，function f(){} e.g [2, "declaration"]// expression：强制使用方法表达式的方式，var f = function() {} e.g [2, "expression"]// allowArrowFunctions: declaration风格中允许箭头函数。 e.g [2, "declaration", { "allowArrowFunctions": true }]"func-style": 0,"no-alert": 0,//禁止使用alert confirm prompt"no-array-constructor": 2,//禁止使用数组构造器"no-bitwise": 0,//禁止使用按位运算符"no-caller": 1,//禁止使用arguments.caller或arguments.callee"no-catch-shadow": 2,//禁止catch子句参数与外部作用域变量同名"no-class-assign": 2,//禁止给类赋值"no-cond-assign": 2,//禁止在条件表达式中使用赋值语句"no-console": 2,//禁止使用console"no-const-assign": 2,//禁止修改const声明的变量"no-constant-condition": 2,//禁止在条件中使用常量表达式 if(true) if(1)"no-continue": 0,//禁止使用continue"no-control-regex": 2,//禁止在正则表达式中使用控制字符"no-debugger": 2,//禁止使用debugger"no-delete-var": 2,//不能对var声明的变量使用delete操作符"no-div-regex": 1,//不能使用看起来像除法的正则表达式/=foo/"no-dupe-keys": 2,//在创建对象字面量时不允许键重复 {a:1,a:1}"no-dupe-args": 2,//函数参数不能重复"no-duplicate-case": 2,//switch中的case标签不能重复"no-else-return": 2,//如果if语句里面有return,后面不能跟else语句"no-empty": 2,//块语句中的内容不能为空"no-empty-character-class": 2,//正则表达式中的[]内容不能为空"no-empty-label": 2,//禁止使用空label"no-eq-null": 2,//禁止对null使用==或!=运算符"no-eval": 1,//禁止使用eval"no-ex-assign": 2,//禁止给catch语句中的异常参数赋值"no-extend-native": 2,//禁止扩展native对象"no-extra-bind": 2,//禁止不必要的函数绑定"no-extra-boolean-cast": 2,//禁止不必要的bool转换"no-extra-parens": 2,//禁止非必要的括号"no-extra-semi": 2,//禁止多余的冒号"no-fallthrough": 1,//禁止switch穿透"no-floating-decimal": 2,//禁止省略浮点数中的0 .5 3."no-func-assign": 2,//禁止重复的函数声明"no-implicit-coercion": 1,//禁止隐式转换"no-implied-eval": 2,//禁止使用隐式eval"no-inline-comments": 0,//禁止行内备注"no-inner-declarations": [2, "functions"],//禁止在块语句中使用声明（变量或函数）"no-invalid-regexp": 2,//禁止无效的正则表达式"no-invalid-this": 2,//禁止无效的this，只能用在构造器，类，对象字面量"no-irregular-whitespace": 2,//不能有不规则的空格"no-iterator": 2,//禁止使用__iterator__ 属性"no-label-var": 2,//label名不能与var声明的变量名相同"no-labels": 2,//禁止标签声明"no-lone-blocks": 2,//禁止不必要的嵌套块"no-lonely-if": 2,//禁止else语句内只有if语句"no-loop-func": 1,//禁止在循环中使用函数（如果没有引用外部变量不形成闭包就可以）"no-mixed-requires": [0, false],//声明时不能混用声明类型"no-mixed-spaces-and-tabs": [2, false],//禁止混用tab和空格"linebreak-style": [0, "windows"],//换行风格"no-multi-spaces": 1,//不能用多余的空格"no-multi-str": 2,//字符串不能用\换行"no-multiple-empty-lines": [1, {"max": 2}],//空行最多不能超过2行"no-native-reassign": 2,//不能重写native对象"no-negated-in-lhs": 2,//in 操作符的左边不能有!"no-nested-ternary": 0,//禁止使用嵌套的三目运算"no-new": 1,//禁止在使用new构造一个实例后不赋值"no-new-func": 1,//禁止使用new Function"no-new-object": 2,//禁止使用new Object()"no-new-require": 2,//禁止使用new require"no-new-wrappers": 2,//禁止使用new创建包装实例，new String new Boolean new Number"no-obj-calls": 2,//不能调用内置的全局对象，比如Math() JSON()"no-octal": 2,//禁止使用八进制数字"no-octal-escape": 2,//禁止使用八进制转义序列"no-param-reassign": 2,//禁止给参数重新赋值"no-path-concat": 0,//node中不能使用__dirname或__filename做路径拼接"no-plusplus": 0,//禁止使用++，--"no-process-env": 0,//禁止使用process.env"no-process-exit": 0,//禁止使用process.exit()"no-proto": 2,//禁止使用__proto__属性"no-redeclare": 2,//禁止重复声明变量"no-regex-spaces": 2,//禁止在正则表达式字面量中使用多个空格 /foo bar/"no-restricted-modules": 0,//如果禁用了指定模块，使用就会报错"no-return-assign": 1,//return 语句中不能有赋值表达式"no-script-url": 0,//禁止使用javascript:void(0)"no-self-compare": 2,//不能比较自身"no-sequences": 0,//禁止使用逗号运算符"no-shadow": 2,//外部作用域中的变量不能与它所包含的作用域中的变量或参数同名"no-shadow-restricted-names": 2,//严格模式中规定的限制标识符不能作为声明时的变量名使用"no-spaced-func": 2,//函数调用时 函数名与()之间不能有空格"no-sparse-arrays": 2,//禁止稀疏数组， [1,,2]"no-sync": 0,//nodejs 禁止同步方法"no-ternary": 0,//禁止使用三目运算符"no-trailing-spaces": 1,//一行结束后面不要有空格"no-this-before-super": 0,//在调用super()之前不能使用this或super"no-throw-literal": 2,//禁止抛出字面量错误 throw "error";"no-undef": 1,//不能有未定义的变量"no-undef-init": 2,//变量初始化时不能直接给它赋值为undefined"no-undefined": 2,//不能使用undefined"no-unexpected-multiline": 2,//避免多行表达式"no-underscore-dangle": 1,//标识符不能以_开头或结尾"no-unneeded-ternary": 2,//禁止不必要的嵌套 var isYes = answer === 1 ? true : false;"no-unreachable": 2,//不能有无法执行的代码"no-unused-expressions": 2,//禁止无用的表达式"no-unused-vars": [2, {"vars": "all", "args": "after-used"}],//不能有声明后未被使用的变量或参数"no-use-before-define": 2,//未定义前不能使用"no-useless-call": 2,//禁止不必要的call和apply"no-void": 2,//禁用void操作符"no-var": 0,//禁用var，用let和const代替"no-warning-comments": [1, { "terms": ["todo", "fixme", "xxx"], "location": "start" }],//不能有警告备注"no-with": 2,//禁用with"array-bracket-spacing": [2, "never"],//是否允许非空数组里面有多余的空格"arrow-parens": 0,//箭头函数用小括号括起来"arrow-spacing": 0,//=>的前/后括号"accessor-pairs": 0,//在对象中使用getter/setter"block-scoped-var": 0,//块语句中使用var"brace-style": [1, "1tbs"],//大括号风格"callback-return": 1,//避免多次调用回调什么的"camelcase": 2,//强制驼峰法命名"comma-dangle": [2, "never"],//对象字面量项尾不能有逗号"comma-spacing": 0,//逗号前后的空格"comma-style": [2, "last"],//逗号风格，换行时在行首还是行尾"complexity": [0, 11],//循环复杂度"computed-property-spacing": [0, "never"],//是否允许计算后的键名什么的"consistent-return": 0,//return 后面是否允许省略"consistent-this": [2, "that"],//this别名"constructor-super": 0,//非派生类不能调用super，派生类必须调用super"curly": [2, "all"],//必须使用 if(){} 中的{}"default-case": 2,//switch语句最后必须有default"dot-location": 0,//对象访问符的位置，换行的时候在行首还是行尾"dot-notation": [0, { "allowKeywords": true }],//避免不必要的方括号"eol-last": 0,//文件以单一的换行符结束"eqeqeq": 2,//必须使用全等"func-names": 0,//函数表达式必须有名字"func-style": [0, "declaration"],//函数风格，规定只能使用函数声明/函数表达式"generator-star-spacing": 0,//生成器函数*的前后空格"guard-for-in": 0,//for in循环要用if语句过滤"handle-callback-err": 0,//nodejs 处理错误"id-length": 0,//变量名长度"indent": [2, 4],//缩进风格"init-declarations": 0,//声明时必须赋初值"key-spacing": [0, { "beforeColon": false, "afterColon": true }],//对象字面量中冒号的前后空格"lines-around-comment": 0,//行前/行后备注"max-depth": [0, 4],//嵌套块深度"max-len": [0, 80, 4],//字符串最大长度"max-nested-callbacks": [0, 2],//回调嵌套深度"max-params": [0, 3],//函数最多只能有3个参数"max-statements": [0, 10],//函数内最多有几个声明"new-cap": 2,//函数名首行大写必须使用new方式调用，首行小写必须用不带new方式调用"new-parens": 2,//new时必须加小括号"newline-after-var": 2,//变量声明后是否需要空一行"object-curly-spacing": [0, "never"],//大括号内是否允许不必要的空格"object-shorthand": 0,//强制对象字面量缩写语法"one-var": 1,//连续声明"operator-assignment": [0, "always"],//赋值运算符 += -=什么的"operator-linebreak": [2, "after"],//换行时运算符在行尾还是行首"padded-blocks": 0,//块语句内行首行尾是否要空行"prefer-const": 0,//首选const"prefer-spread": 0,//首选展开运算"prefer-reflect": 0,//首选Reflect的方法"quotes": [1, "single"],//引号类型 `` "" ''"quote-props":[2, "always"],//对象字面量中的属性名是否强制双引号"radix": 2,//parseInt必须指定第二个参数"id-match": 0,//命名检测"require-yield": 0,//生成器函数必须有yield"semi": [2, "always"],//语句强制分号结尾"semi-spacing": [0, {"before": false, "after": true}],//分号前后空格"sort-vars": 0,//变量声明时排序"space-after-keywords": [0, "always"],//关键字后面是否要空一格"space-before-blocks": [0, "always"],//不以新行开始的块{前面要不要有空格"space-before-function-paren": [0, "always"],//函数定义时括号前面要不要有空格"space-in-parens": [0, "never"],//小括号里面要不要有空格"space-infix-ops": 0,//中缀操作符周围要不要有空格"space-return-throw-case": 2,//return throw case后面要不要加空格"space-unary-ops": [0, { "words": true, "nonwords": false }],//一元运算符的前/后要不要加空格"spaced-comment": 0,//注释风格不要有空格什么的"strict": 2,//使用严格模式"use-isnan": 2,//禁止比较时使用NaN，只能用isNaN()"valid-jsdoc": 0,//jsdoc规则"valid-typeof": 2,//必须使用合法的typeof的值"vars-on-top": 2,//var必须放在作用域顶部"wrap-iife": [2, "inside"],//立即执行函数表达式的小括号风格"wrap-regex": 0,//正则表达式字面量用小括号包起来"yoda": [2, "never"]//禁止尤达条件}
}
module.exports = {root: true,parserOptions: {parser: 'babel-eslint',sourceType: 'module'},env: {browser: true,node: true,es6: true,},extends: ['plugin:vue/recommended', 'eslint:recommended'],// add your custom rules here//it is base on https://github.com/vuejs/eslint-config-vuerules: {// 强制"for"循环中更新子句的计算器朝着正确的方向移动'for-direction': 0,// 禁止function定义中出现重名参数'no-dupe-args': 2,// 禁止对象字面量中出现重复的key'no-dupe-keys': 2,// 禁止出现重复的case标签'no-duplicate-case': 2,// 禁止对catch子句的参数重新赋值'no-ex-assign': 2,// 禁止对关系运算符的左操作数使用否定操作符'no-unsafe-negation': 2,// 禁止出现令人困惑的多行表达式'no-unexpected-multiline': 2,// 禁止在return、throw、continue、break语句之后出现不可达代码'no-unreachable': 2,// 禁止在finally语句块中出现控制流语句'no-unsafe-finally': 2,// 要求使用isNaN()检查NaN'use-isnan': 2,// 强制typeof表达式与有效的字符串进行比较'valid-typeof': 2,// 还可以写表达式，厉害了~'no-debugger': process.env.NODE_ENV === 'production' ? 'error': 'off','no-console': process.env.NODE_ENV === 'production' ? 'error': 'off',/*** 【================================================ Best Practices ================================================】* 这些规则是关于最佳实践的，帮助你避免一些问题。*/// 强制 getter 和 setter在对象中成对出现'accessor-pairs': 2,// 强制所有控制语句使用一致的括号风格'curly': [2, 'multi-line'],// 强制在点号之前和之后一致的换行'dot-location': [2, 'property'],// 要求使用 ===和 !=='eqeqeq': [2, 'allow-null'],// 禁用arguments.caller 或 arguments.callee'no-caller': 2,// 禁止使用空解构模式'no-empty-pattern': 2,// 禁止eval()'no-eval': 2,// 禁止使用类似eval()的方法'no-implied-eval': 2,// 禁止扩展原生类型'no-extend-native': 2,// 禁止不必要的.bind()调用'no-extra-bind': 2,// 禁止case语句落空'no-fallthrough': 2,// 禁止数字字面量中使用前导和末尾小数点'no-floating-decimal': 2,// 禁用__iterator__属性'no-iterator': 2,// 禁用标签语句'no-labels': [2, {'allowLoop' : false,'allowSwitch': false}],// 禁用不必要嵌套块'no-lone-blocks': 2,// 禁止使用多个空格'no-multi-spaces': 2,// 禁止使用多行字符串'no-multi-str': 2,// 禁止对String，Number 和 Boolean 使用new操作符'no-new-wrappers': 2,// 禁用八进制字面量'no-octal': 2,// 禁止在字符串中使用八进制转义序列'no-octal-escape': 2,// 禁止使用__proto__属性'no-proto': 2,// 禁止多次声明同一变量'no-redeclare': 2,// 禁止在return语句中使用赋值语句'no-return-assign': [2, 'except-parens'],// 禁止自我赋值'no-self-assign': 2,// 禁止自我比较'no-self-compare': 2,// 禁用逗号操作符'no-sequences': 2,// 禁止抛出异常字面量'no-throw-literal': 2,// 禁止一成不变的循环条件'no-unmodified-loop-condition': 2,// 禁止不必要的.call()和.apply()'no-useless-call': 2,// 禁止不必要的转义字符'no-useless-escape': 2,// 禁用with语句'no-with': 2,// 要求IIFE使用括号括起来'wrap-iife': 2,// 要求或禁止Yoda条件。 if("red" === color) { //字面量在前，变量在后 }'yoda': [2, 'never'], // 比较绝不能是Yoda条件（需要变量在前，字面量在后）/*** 【================================================ ECMAScript 6 ================================================】* 这些规则只与ES6有关，即通常所说的ES2015。*/// 强制箭头函数前后使用一致的空格'arrow-spacing': [2, {'before': true,'after' : true}],// 要求在构造函数中有super()调用'constructor-super': 2,// 强制generator函数中*号周围使用一致的空格'generator-star-spacing': [2, {'before': true,'after' : true}],// 禁止修改类声明的变量'no-class-assign': 2,// 禁止修改const声明的变量'no-const-assign': 2,// 禁止类成员中出现重复的名称'no-dupe-class-members': 2,// 禁止 Symbolnew 操作符和 new 一起使用'no-new-symbol': 2,// 禁止在构造函数中，在调用super()之前使用 this 或 super'no-this-before-super': 2,// 禁止在对象中使用不必要的计算属性'no-useless-computed-key': 2,// 禁止不必要的构造函数'no-useless-constructor': 2,// 禁止模板字符串中嵌入表达式周围空格的使用'template-curly-spacing': [2, 'never'],// 强制yield*表达式中的*周围使用空格'yield-star-spacing': [2, 'both'],// 要求使用const声明那些声明后不再被修改的变量'prefer-const': 2,/*** 【================================================ Stylistic Issues ================================================】* 这些规则是关于代码风格的。*/// // 获取当前执行环境的上下文时，强制使用一致的命名（此处强制使用 'that'）。// 'consistent-this': [2, 'that'],// // 禁止或强制在代码块中开括号前和闭括号后有空格 { return 11 }// 'block-spacing': [2, 'always'],// // 强制在代码块中使用一致的大括号风格// 'brace-style': [2, '1tbs', {// 'allowSingleLine': true// }],// // 强制使用驼峰拼写法命名规定// 'camelcase': [0, {// 'properties': 'always'// }],// // 要求或禁止末尾逗号// 'comma-dangle': [2, 'never'],// // 强制在逗号前后使用一致的空格// 'comma-spacing': [2, {// 'before': false,// 'after' : true// }],// // 强制在逗号前后使用一致的空格// 'comma-style': [2, 'last'],// // 要求或禁止文件末尾存在空行// 'eol-last': 2,// // 强制使用一致的缩进// 'indent': [2, 2, {// 'SwitchCase': 1// }],// // 强制在JSX属性中一致地使用双引号或单引号// 'jsx-quotes': [2, 'prefer-single'],// // 要求构造函数首字母大写// 'new-cap': [2, {// 'newIsCap': true,// 'capIsNew': false// }],// // 要求构造无参构造函数时有圆括号// 'new-parens': 2,// // 禁用Array构造函数// 'no-array-constructor': 2,// // 禁止空格和tab的混合缩进// 'no-mixed-spaces-and-tabs': 2,// // 禁止出现多行空行// 'no-multiple-empty-lines': [2, {// // 最大连续空行数// max: 2// }],// // 禁止在函数标识符和其调用之间有空格// 'func-call-spacing': 2,// // 禁止行尾空格// 'no-trailing-spaces': 2,// // 禁止可以在有更简单的可替代的表达式时使用三元操作符// 'no-unneeded-ternary': [2, {// // 允许表达式作为默认的赋值模式// 'defaultAssignment': true// }],// // 禁止属性前有空白// 'no-whitespace-before-property': 2,// // 强制函数中的变量要么一起声明要么分开声明// 'one-var': [2, {// 'initialized': 'never'// }],// // 强制操作符使用一致的换行符// 'operator-linebreak': [2, 'after', {// 'overrides': {// '?': 'before',// ':': 'before'// }// }],// // 要求或禁止块内填充// 'padded-blocks': [2, 'never'],// // 强烈使用一致的反勾号``、双引号""或单引号''// 'quotes': [2, 'single', {// // 允许字符串使用单引号或者双引号，只要字符串中包含了一个其他引号，否则需要转义// 'avoidEscape': true,// // 允许字符串使用反勾号// 'allowTemplateLiterals': true// }],// // 禁止使用分号代替ASI(自动分号插入)// 'semi': ["error", "always"],// // 强制分号之前和之后使用一致的空格// 'semi-spacing': [2, {// 'before': false,// 'after' : true// }],// // 强制在块之前使用一致的空格// 'space-before-blocks': [2, 'always'],// // 强制在圆括号内使用一致的空格// 'space-in-parens': [2, 'never'],// // 要求操作符周围有空格// 'space-infix-ops': 2,// // 强制在一元操作符前后使用一致的空格// 'space-unary-ops': [2, {// 'words' : true,// 'nonwords': false// }],// // 强制在注释// 或/*使用一致的空格// 'spaced-comment': [1, 'always', {// 'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']// }],// // 强制在大括号中使用一致的空格// 'object-curly-spacing': [2, 'always', {// 'objectsInObjects': false// }],// // 禁止或强制在括号内使用空格// 'array-bracket-spacing': [2, 'never'],// // 强制要求在对象字面量的属性中键和值之间使用一致的间距// 'key-spacing': [2, {// 'beforeColon': false,// 'afterColon' : true// }],/*** 【================================================ Node.js and CommonJS ================================================】* 这些规则是关于Node.js 或 在浏览器中使用CommonJS的。*/// 要求回调函数中有容错处理'handle-callback-err': [2, '^(err|error)$'],// 禁止调用 require 时使用new操作符'no-new-require': 2,// 禁止对__dirname和__filename进行字符串连接'no-path-concat': 1,// 强制在function的左括号之前使用一致的空格'space-before-function-paren': [2, 'never'],/*** 【================================================ Possible Errors ================================================】* 这些规则与JavaScript代码中可能的错误或逻辑错误有关。*/// 禁止条件表达式中出现赋值操作符'no-cond-assign': 2,// 禁止在正则表达式中使用控制字符'no-control-regex': 0,// 禁止在正则表达式中使用空字符集'no-empty-character-class': 2,// 禁止不必要的布尔转换'no-extra-boolean-cast': 2,// 禁止不必要的括号'no-extra-parens': [2, 'functions'],// 禁止对function声明重新赋值'no-func-assign': 2,// 禁止在嵌套块中出现变量声明或function声明'no-inner-declarations': [2, 'functions'],// 禁止RegExp构造函数中存在无效的正则表达式字符串'no-invalid-regexp': 2,// 禁止在字符串和注释之外不规则的空白'no-irregular-whitespace': 2,// 禁止把全局对象作为函数调用'no-obj-calls': 2,// 禁止正则表达式字面量中出现多个空格'no-regex-spaces': 2,// 禁用稀疏数组'no-sparse-arrays': 2,/*** 【================================================ Variables ================================================】* 这些规则与变量声明有关。*/// 禁止删除变量'no-delete-var': 2,// 不允许标签与变量同名'no-label-var': 2,// 禁止将标识符定义为受限的名字'no-shadow-restricted-names': 2,// 禁止未声明的变量，除非它们在/*global */注释中被提到'no-undef': 2,// 禁止将变量初始化为undefined'no-undef-init': 2,// 禁止出现未使用的变量'no-unused-vars': [2, {'var' : 'all','args': 'none'}],/*** 【================================================ 配置定义在插件中的规则 ================================================】* 格式： 插件名/规则ID*///'vue/no-parsing-error': ["off"]}
}
![[每周一更]-(第100期)：介绍 goctl自动生成代码](https://img-blog.csdnimg.cn/direct/a12ecf2f35644037adb8209605eccf85.jpeg#pic_center)
![[office] 如何在Excel中拉动单元格时表头不变形- #学习方法#职场发展#经验分享](https://img-blog.csdnimg.cn/img_convert/5a3c06638554f1864bcb49673ff3ad98.jpeg)
