eslint-plugin-wjs

eslint-plugin-wjs 是基于公司定义的规范中能被eslint检查的条款生成的一份公共的eslint配置，方便不同的项目之间引用。

1. 安装

npm install eslint-plugin-wjs --D
or
yarn add eslint-plugin-wjs --D

2. 使用

2.1 前置依赖项

本插件依赖以下npm库：

| 库名称 | 推荐版本 | 说明 | |----|----|----| | eslint | ^6.8.0 | - | | eslint-plugin-simple-import-sort | ^10.0.0 | 这个主要是规范import语句的，涉及到import合并和排序，这个插件可以自动格式化 | | eslint-plugin-vue | ^6.2.2 | vue官方推荐的eslint插件，本插件在官方插件基础上做了一些定制化配置 |

说明： 本插件库是一个eslint配置集合，虽然依赖于上面的库但不严格要求使用推荐版本，使用者可以自由更新依赖库的版本，自行处理好各版本之间的兼容性即可。

2.2 使用指引

本插件和其他的eslint插件的使用并没有不同，直接在.eslintrc.js中继承即可：

module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'plugin:vue/recommended',
    'eslint:recommended',
    'plugin:wjs/vue2-recommended'
  ],
  parserOptions: {
    parser: 'babel-eslint'
  },
  ignorePatterns: ["src/**/*.min.js"]
}

当前版本下只包含了一个 vue2-recommended 一个配置集合，如果后续有 typescript-recommended、vue3-recommended 的集合引入方式也类似，在 .eslintrc.js 的 extends 添加 plugin:wjs/typescript-recommended 和 plugin:wjs/vue3-recommended 即可。

3. 配置集说明

3.1 vue2-recommended

• generator-star-spacing：off
• array-bracket-spacing：[error, "never"]
• array-element-newline: [error, "consistent"], //数字内容换行的时候报错并修复；
• array-callback-return: error, //数组的form/every/filter/find/findIndex/reduce/reduceRight/some/sort没有return的时候报错；
• block-scoped-var: error, //变量在定义块的外部使用时，规则会生成警告
• complexity: [error, 30], //循环复杂度测量程序源代码中线性独立路径的数量
• for-direction: error, //无限循环代码报错
• func-call-spacing: [error, "never"], //调用的方法前边不允许有空格并修复
• func-name-matching: [error, "never"], //函数名称与它们所分配的变量或属性的名称相匹配
• eqeqeq: [error, "smart"], //运算规则符号===/!==校验
• lines-between-class-members: [error, "always"], //同一个class方法中间空行
• max-depth: [error, 4], //最深的层级，其他可以另写方法
• max-lines: [error, 5000], // 主要是限于老版本改造量大所以放的比较宽，新建项目引入的时候建议覆盖为500
• max-params: [error, 4], //单个方法的入参数虽多4个
• max-statements-per-line: [error, { "max": 2 }], //每行允许有几个方法
• no-bitwise: error, //运算符检查'||',error'|'
• no-else-return: error, //if有return else不需要使用并且自动修复
• no-empty: error, //方法块里边没有执行其他语句
• no-empty-function: error, //空方法报错
• no-lonely-if: error, //如果一个if陈述是该else块中唯一的陈述，那么使用一个else if表格通常会更清晰
• no-mixed-spaces-and-tabs: error, //不允许使用混合空格和制表符进行缩进
• no-multiple-empty-lines: [error, { "max": 1, "maxEOF": 1 }], //允许文件结尾处强制执行最大数量的连续空1行并且自动修复
• no-nested-ternary: error, //规则不允许嵌套的三元表达式
• no-template-curly-in-string: error, //它会在发现一个包含模板文字 place holder（${something}）的字符串时发出警告
• no-trailing-spaces: error, //不允许在行尾添加尾随空白git对比差异产生冲突，自动修复
• no-unreachable: error, //不允许可达代码后return，throw，continue，和break语句
• no-useless-concat: error, //标记2个文字的连接，当它们可以合并成一个文字时
• no-var: error, //阻止var使用或鼓励改为使用const或let,并且自动修复
• require-await: error, //警告不具有await表达式的异步函数
• semi-spacing: [error, { "before": false, "after": true }], //防止在表达式中使用分号之前的空格。
• space-before-blocks: [error, "always"], //blocks块必须至少有一个先前的空间
• space-before-function-paren: [error, "never"], //关键字与开始参数之间不允许有空格,匿名函数的关键字之后可能需要一个空格并且自动修复
• spaced-comment: [error, "always", { "block": { "balanced": true } }], //强制间距的一致性//或/*
• template-curly-spacing: error, //模板文字内部空间的一致性
• no-duplicate-imports: [error, { "includeExports": true }],
• no-self-compare: warn,
• no-unmodified-loop-condition: warn,
• no-use-before-define: [error, "nofunc"],
• default-case: error,
• curly: error,
• default-param-last: error,
• no-caller: warn,
• no-invalid-this: warn,
• no-return-assign: [error, "always"],
• no-shadow: error,
• no-unneeded-ternary: warn,
• no-useless-return: warn,
• prefer-const: warn,
• prefer-object-spread: warn,
• dot-notation: error,
• no-eval: error,
• prefer-template: warn,
• no-new-func: error,
• no-param-reassign: warn,
• arrow-body-style: [error, "as-needed"],
• simple-import-sort/imports: error,
• indent: ["error", 2, { "SwitchCase": 1 }],
• vue/require-default-prop: off,
• vue/html-closing-bracket-newline: [error, { "singleline": "never", "multiline": "never" }],
• vue/attributes-order: [error, { "order": [ "DEFINITION", "LIST_RENDERING", "CONDITIONALS", "RENDER_MODIFIERS", "GLOBAL", ["UNIQUE", "SLOT"], "TWO_WAY_BINDING", "OTHER_DIRECTIVES", "OTHER_ATTR", "EVENTS", "CONTENT" ], "alphabetical": false }],
• vue/max-attributes-per-line: [error, { "singleline": { "max": 3}, "multiline*: { "max": 1 } }],
• vue/html-indent: [error, 2, { "attribute": 1, "baseIndent": 1,"closeBracket": 0, "alignAttributesVertically": true, "ignores": [] }],
• no-unused-vars: [error, { "argsIgnorePattern": "_", "args":"after-used", "var": "all", "ignoreRestSiblings": true }]