Eslint 经典配置

package.json：

{
  "dependencies": {
    "babel-eslint": "^10.0.3",
    "eslint": "^6.6.0",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-react": "^7.16.0",
    "eslint-plugin-react-hooks": "^2.2.0",
    "react": "^16.11.0"
  }
}

.eslintrc.js :

module.exports = {
  parser: 'babel-eslint',  // 指定 eslint 的解析器 / Specifies the ESLint parser 
  parserOptions: {
    ecmaVersion: 2015, // 指定 js 语法版本 / specify the version of ECMAScript syntax you want to use: 2015 => (ES6)
    sourceType: 'module',  // 允许使用 imports / Allows for the use of imports
    ecmaFeatures: {
      jsx: true, // 启用 JSX / enable JSX
      impliedStrict: true // 允许使用全局严格模式 / enable global strict mode
    }
  },
  extends: [
    'airbnb',  // 使用 airbnb 库 / Uses airbnb, it including the react rule(eslint-plugin-react/eslint-plugin-jsx-a11y)
    'plugin:promise/recommended',
    // 'prettier', // 使用 prettier / Use prettier, it can disable all rules which conflict with prettier
    // 'prettier/react' // Use prettier/react to pretty react syntax
  ],
  settings: {
    'import/resolver': { // This config is used by eslint-import-resolver-webpack
      webpack: {
        config: './webpack/webpack-common-config.js'
      }
    },
  },
  env: {
    browser: true // enable all browser global variables
  },
  'plugins': ['react-hooks', 'promise'], // ['prettier', 'react-hooks']
  rules: {
    // Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
    // e.g. '@typescript-eslint/explicit-function-return-type': 'off',
    "react-hooks/rules-of-hooks": "error",
    "linebreak-style": ["off", "windows"],
    "semi": ["error", "never"],
    "react/jsx-one-expression-per-line": 0,
    "no-use-before-define": ["off", { "functions": true, "classes": true }],
    "prefer-arrow-callback": ["off", { "allowNamedFunctions": true }]
    /**
     * @description rules of eslint-plugin-prettier
     */
    // 'prettier/prettier': [
    //   'error', {
    //     'singleQuote': true,
    //     'semi': false
    //   }
    // ]
  },
};

使用 npm install 安装依赖

然后后在配置中选择 Eslint: Auto Fix On Save 为 true