eslint-config-5e

eslint-config-5e: 是一款定制化的eslint 规范插件, 自身也支持横向拓展

项目中集成

默认你的前置依赖有: typescript,eslint,prettier

方式1:

1: yarn add eslint-config-5e -D

2: use:
根目录下新增: .eslintrc (搭配vscode 自身带检查功能)
{
  "extends": ['5e']   // 当然也可以是: ['5e/react', '5e/base']
}

3: package.json 添加命令: "eslint": "eslint --fix --ext .jsx,.js,.tsx,.ts ./src"

如果你需要,你可以针对规则进行引用目前支持的规则有2类: base(prettier + eslint + typescript) / react

如果你需要集成: base

{
  "extends": ['5e/base']
}

如果你只要要集成: react

{
  "extends": ['5e/react']
}

方式2:

1: 项目下安装: yarn add eslint-config-5e -D
2: 使用: package.json 添加命令: "5elint": "5elint" : (yarn 5elint)  这里读取的配置默认是: 5e (base + react)

ps. 由于执行过程默认是fix 你的不合法代码, 注意使用过程是否需要这样做

ps. 对于方式2是不支持编辑器自带检测

changelog

0.0.11

---> 修复当函数入参是对象时member-delimiter-style的单行定界符和prettier冲突，优先prettier(todo,应该优先eslint逗号定界符)
---> 修复space-before-function-paren与perttier匿名函数表达式的格式不兼容问题
---> 修改no-debugger允许使用debugger
---> 新增规则array-callback-return
---> 新增规则arrow-spacing
---> 新增规则max-params
---> 新增规则new-cap
---> 新增规则no-class-assign
---> 新增规则no-useless-rename
---> 新增规则no-else-return
---> 新增规则no-obj-calls
---> 新增规则no-global-assign
---> 新增规则no-param-reassign
---> 新增规则no-useless-concat
---> 新增规则no-new-symbol
---> 新增规则no-constant-condition
---> 新增规则no-extra-boolean-cast
---> 新增规则no-extra-parens
---> 新增规则prefer-arrow-callback
---> 新增规则prefer-rest-params
---> 新增规则prefer-template
---> 新增规则require-yield

6. 0.0.10

---> 关闭该条规则 @typescript-eslint/interface-name-prefix 
---> 检测配置修改为目录下的 .eslintrc ...

5. 0.0.9

---> 关闭规则: sort-imports

4. 0.0.8

---> 修复只引入 5e/react 时触发 eslint 命令报错
---> 关闭规则 react/jsx-closing-bracket-location, 修复prettier
---> 添加 sort-imports 规则 引入文件规则
---> 关闭规则hook exhaustive-deps , 默认修复的时候可能造成逻辑出错

3. 0.0.7

---> 修复命令操作: yarn 5elint 

2. 0.0.6

---> 修复规则: object-curly-newline 与prettier 的冲突
---> 新增react 相关部分规则

1. 0.0.5

---> prettier 集成进入eslint, 检查时会先prettier进行格式化,然后在eslint --fix 代码

目前暂定的prettier规则:

{
  printWidth: 100,
  tabWidth: 2,
  useTabs: false,
  semi: false,
  singleQuote: true,
  quoteProps: 'as-needed',
  jsxSingleQuote: false,
  trailingComma: 'es5',
  bracketSpacing: false,
  jsxBracketSameLine: true,
  arrowParens: 'avoid',
  rangeStart: 0,
  rangeEnd: Infinity,
  htmlWhitespaceSensitivity: 'css',
  endOfLine: 'lf'
}

ps. 目前将prettier 集成进入 eslint 规则以后, 确实是有规则出现了冲突, 目前的解决方案是以 prettier 规则为主, 暂时忽略掉eslint中出现冲突的rule

参考配置

1. typescript-eslint rule
2. eslint rules
3. eslint-plugin-react
4. prettier