eslint

pnpm add eslint -D

module.exports = {
    extends:[
        "eslint:recommended"
    ]
}

eslint-config-airbnb

配置

module.exports = {
    extends:[
        "airbnb",
    ]
}

配置解读

eslint-config-airbnb配置具体内容

module.exports = {
  extends: [
    'eslint-config-airbnb-base',
    './rules/react',
    './rules/react-a11y',
  ].map(require.resolve),
  rules: {}
};

eslint-config-airbnb-base

module.exports = {
  extends: [
    './rules/best-practices',
    './rules/errors',
    './rules/node',
    './rules/style',
    './rules/variables',
    './rules/es6',
    './rules/imports',
    './rules/strict',
  ].map(require.resolve),
  parserOptions: {
    ecmaVersion: 2018,
    sourceType: 'module',
  },
  rules: {},
};

比较特别的是：./rules/imports引入了eslint-plugin-import

'./rules/react'

引入了eslint-plugin-react

如果需要引入react-hooks

需要配置

module.exports = { 
    extends:[ "airbnb/hooks", ] 
}

结论

module.exports = {
    extends:[
        "airbnb",
        "airbnb/hooks",
    ]
}

接入eslint-plugin-prettier

需要安装eslint-config-prettier

module.exports = {
    extends:[
        "airbnb",
        "airbnb/hooks",
        "plugin:prettier/recommended"
    ]
}

所有依赖

• eslint-config-airbnb
  • eslint-config-base
• eslint-plugin-import(peerDependencies)
• eslint-plugin-react(peerDependencies)
• eslint-plugin-react-hook(peerDependencies)
• eslint-plugin-jsx-a11y(peerDependencies)
• eslint-config-prettier
• eslint-plugin-prettier(peerDependencies)
• @typescript-eslint/eslint-plugin
• @typescript-eslint/parser