使用airbnb规范
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 }
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 }
原文:https://www.cnblogs.com/zhihou/p/14376764.html