首页 > 其他 > 详细

eslint整理

时间:2021-02-05 12:58:51      阅读:36      评论:0      收藏:0      [点我收藏+]

使用airbnb规范

/**
 * https://www.npmjs.com/package/eslint-config-airbnb-typescript
 */
上安装 参考上述链接
@typescript-eslint/eslint-plugin
@typescript-eslint/parser
eslint
eslint-config-airbnb-typescript
eslint-plugin-import
eslint-plugin-jsx-a11y
eslint-plugin-react
eslint-plugin-react-hooks
webpack-eslint-plugin
上package.json配置
 1 "scripts": {
 2     "lint": "eslint ./src/**/*.{ts,tsx,js,jsx} --ext .ts,.tsx,.js,.jsx",
 3   },
 4 "husky": {
 5     "hooks": {
 6       // npm run commit 会自动执行以下两个钩子,进行代码规范(注意:不会修复语法错误)的修复
 7       "pre-commit": "lint-staged --allow-empty", 
 8     }
 9   },
10   "lint-staged": {
11     "src/**/*.{ts,tsx,js,jsx}": [
12       "eslint --fix"
13     ]
14   }

上配置
创建.eslintrc.js 文件
  1 module.exports = {
  2   extends: [
  3     ‘airbnb-typescript‘,
  4     ‘airbnb/hooks‘,
  5     ‘plugin:@typescript-eslint/recommended‘,
  6     ‘plugin:@typescript-eslint/recommended-requiring-type-checking‘,
  7   ],
  8   env: { //指定你想启用的环境
  9     es6: true,
 10   },
 11   plugins: [ //存放插件名字的列表
 12     ‘@typescript-eslint‘,
 13   ],
 14   parserOptions: {
 15     project: ‘./tsconfig.json‘,
 16     ecmaFeatures: {
 17       jsx: true, // 启用 JSX
 18       tsx: true,
 19     },
 20     ecmaVersion: 2020,
 21     useJSXTextNode: true,
 22     sourceType: ‘module‘,
 23   },
 24   rules:{
 25     // react-hooks
 26     ‘react-hooks/rules-of-hooks‘: ‘error‘,
 27     ‘react-hooks/exhaustive-deps‘: ‘off‘,
 28     //代码风格
 29     ‘import/no-cycle‘: ‘off‘,
 30     ‘import/no-extraneous-dependencies‘: ‘off‘,
 31     ‘import/no-named-as-default-member‘: ‘off‘,
 32     ‘operator-linebreak‘: ‘off‘, //强制操作符使用一致的换行符
 33     ‘import/order‘: ‘off‘,
 34     ‘linebreak-style‘: ‘off‘, //强制使用一致的换行风格
 35     ‘no-console‘: ‘off‘, // 禁用 console
 36     ‘class-methods-use-this‘: ‘off‘, //强制类方法使用 this
 37     ‘max-classes-per-file‘: ‘off‘, // 强制每个文件中包含的的类的最大数量
 38     ‘consistent-return‘: ‘off‘, // 要求 return 语句要么总是指定返回的值,要么不指定
 39     ‘default-case‘: ‘off‘, // 要求 switch 语句中有 default 分支
 40     ‘global-require‘: ‘off‘, // 要求 require() 出现在顶层模块作用域中
 41     ‘import/no-dynamic-require‘: ‘off‘,
 42     ‘generator-star-spacing‘: ‘off‘, // 强制 generator 函数中 * 号周围使用一致的空格
 43     ‘max-len‘: [‘error‘, { ‘code‘: 130 }], //强制一行的最大长度
 44     // typescript
 45     ‘@typescript-eslint/no-var-requires‘: ‘off‘,
 46     ‘@typescript-eslint/no-inferrable-types‘: ‘off‘,
 47     ‘@typescript-eslint/naming-convention‘: ‘off‘,
 48     ‘@typescript-eslint/no-unnecessary-type-assertion‘: ‘off‘,
 49     ‘@typescript-eslint/no-unused-vars‘: ‘off‘,
 50     ‘@typescript-eslint/no-useless-constructor‘: ‘off‘,
 51     ‘@typescript-eslint/no-use-before-define‘: ‘off‘,
 52     ‘@typescript-eslint/no-unsafe-assignment‘: ‘off‘,
 53     ‘@typescript-eslint/no-unsafe-member-access‘: ‘off‘,
 54     ‘@typescript-eslint/no-unsafe-call‘: ‘off‘,
 55     ‘@typescript-eslint/no-unsafe-return‘: ‘off‘,
 56     ‘@typescript-eslint/restrict-template-expressions‘: ‘off‘,
 57     ‘@typescript-eslint/await-thenable‘: ‘off‘,
 58     ‘@typescript-eslint/unbound-method‘: ‘off‘,
 59     ‘@typescript-eslint/restrict-plus-operands‘: ‘off‘,
 60     ‘@typescript-eslint/no-floating-promises‘: ‘off‘,
 61     ‘@typescript-eslint/explicit-module-boundary-types‘: ‘off‘,
 62     ‘@typescript-eslint/no-explicit-any‘: ‘off‘,
 63     ‘@typescript-eslint/ban-types‘: ‘off‘,
 64     ‘@typescript-eslint/ban-ts-comment‘: ‘off‘,
 65     ‘@typescript-eslint/no-namespace‘: ‘off‘,
 66     ‘@typescript-eslint/no-misused-promises‘: ‘off‘,
 67     ‘@typescript-eslint/prefer-regexp-exec‘: ‘off‘,
 68     // javascript
 69     ‘func-names‘: ‘off‘, //要求或禁止使用命名的 function 表达式
 70     ‘no-bitwise‘: ‘off‘, //禁用按位运算符
 71     ‘no-plusplus‘: ‘off‘, // 禁用一元操作符 ++ 和 --
 72     ‘prefer-template‘: ‘off‘, //要求使用模板字面量而非字符串连接
 73     ‘object-curly-newline‘: ‘off‘, //强制大括号内换行符的一致性
 74     ‘no-param-reassign‘: ‘off‘, //禁止对 function 的参数进行重新赋值
 75     ‘no-restricted-globals‘: ‘off‘, //禁用特定的全局变量
 76     ‘no-underscore-dangle‘: ‘off‘, //禁止标识符中有悬空下划线
 77     ‘no-restricted-syntax‘: ‘off‘, //禁用特定的语法
 78     ‘no-useless-escape‘: ‘off‘, //禁用不必要的转义字符
 79     ‘no-confusing-arrow‘: ‘off‘, //禁止在可能与比较操作符相混淆的地方使用箭头函数
 80     ‘no-new‘: ‘off‘, //禁止使用 new 以避免产生副作用
 81     ‘no-void‘: ‘off‘, // 禁用 void 操作符
 82     ‘prefer-rest-params‘: ‘off‘, //要求使用剩余参数而不是 arguments
 83     ‘no-async-promise-executor‘: ‘off‘, //禁止使用异步函数作为 Promise executor
 84     ‘no-case-declarations‘: ‘off‘, //    不允许在 case 子句中使用词法声明
 85     // jsx
 86     ‘jsx-a11y/anchor-is-valid‘: ‘off‘,
 87     ‘react/jsx-first-prop-new-line‘: ‘off‘,
 88     ‘react/jsx-max-props-per-line‘: ‘off‘,
 89     ‘react/jsx-one-expression-per-line‘: ‘off‘,
 90     ‘react/jsx-props-no-spreading‘: ‘off‘,
 91     ‘react/jsx-boolean-value‘: ‘off‘,
 92     ‘jsx-a11y/label-has-associated-control‘: ‘off‘,
 93     ‘jsx-a11y/click-events-have-key-events‘: ‘off‘,
 94     ‘jsx-a11y/no-static-element-interactions‘: ‘off‘,
 95     ‘jsx-a11y/no-noninteractive-element-interactions‘: ‘off‘,
 96     ‘jsx-a11y/alt-text‘: ‘off‘,
 97     //react
 98     ‘react/jsx-uses-react‘: ‘off‘,
 99     ‘react/react-in-jsx-scope‘: ‘off‘,
100     ‘react/display-name‘: ‘off‘,
101     ‘arrow-parens‘: ‘off‘, // 要求箭头函数的参数使用圆括号
102     ‘react/sort-comp‘: ‘off‘,
103     ‘react/no-deprecated‘: ‘off‘,
104     ‘react/button-has-type‘: ‘off‘,
105     ‘react/prop-types‘: ‘off‘,
106     ‘arrow-body-style‘: ‘off‘, //要求箭头函数体使用大括号
107     ‘react/require-default-props‘: ‘off‘,
108     ‘react/no-array-index-key‘: ‘off‘,
109     ‘react/static-property-placement‘: ‘off‘,
110     ‘react/prefer-stateless-function‘: ‘off‘,
111     ‘react/state-in-constructor‘: ‘off‘,
112     ‘no-nested-ternary‘: ‘off‘, // 禁用嵌套的三元表达式
113     ‘react/no-danger‘: ‘off‘,
114   }
115 }

创建.eslintignore文件

dist/*
build/*
mocker/*
scripts/*
node_modules/*
readme
src/assets
.eslintrc.js
babel.config.js
.cz-config.js
commitlint.config.js
setupTests.ts
jest.config.js

然后上个代码修复(毕竟直接上eslint别人会很反感你)
在vscode里面做相应的配置 ,保存的时候会做不规范修复

 1 {
 2   "editor.formatOnSave": false, //代码格式化快捷键及保存时自动格式化
 3   "editor.formatOnPaste": false,
 4   "editor.tabSize": 2,
 5   "editor.insertSpaces": true,
 6   "editor.codeActionsOnSave": {
 7     "source.fixAll.eslint": true, //Eslint更新在VSCode中无法保存的时候格式化代码
 8     "source.fixAll.tslint": true,
 9     "source.fixAll.stylelint": false
10   },
11   "eslint.options": {
12     "configFile": "./.eslintrc.js"
13   },  
14 }

eslint整理

原文:https://www.cnblogs.com/zhihou/p/14376764.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!