8

我尝试为 TypeScript 安装和使用 ESLint Airbnb 配置几天,但我无法让它工作。有人可以提供工作配置的安装和配置步骤吗?

下面是我尝试使用 Airbnb 约定对这个代码库进行 lint 的尝试之一。

Airbnb 配置还不支持Typescript ESLint 3.0,所以我将安装 TypeScript ESLint 2.34。Typescript ESLint 2.34 还不支持 ESLint 7,所以我将安装 ESLint 6.x。Typescript ESLint 2.34 还不支持 Typescript 3.8,所以我将安装 Typescript 3.7.5。

我安装打字稿:

npm init -y
npm i -D typescript@3.7.5 --save-exact

我安装 ESLint 和 TypeScript ESLint:

npm i -D eslint@6 @typescript-eslint/parser@2 @typescript-eslint/eslint-plugin@2

我安装 Airbnb 配置:

npm i -D eslint-config-airbnb-typescript@7 eslint-plugin-import@2

我使用以下内容创建 .eslintrc.js 文件:

module.exports = {
  root: true,

  //required!; use the previously installed parser; it allows ESLint to understand
  //TypeScript syntax; it converts TypeScript into an ESTree-compatible form so it
  //can be used in ESLint
  parser: '@typescript-eslint/parser',               

  parserOptions: {
    project: ['./tsconfig.json'],  //required for "type-aware linting"
  },

  plugins: [
    //load the previously installed plugin; allows me to use the rules within my codebase
    '@typescript-eslint',
  ],

  extends: [  // 'eslint-config-' can be ommited ex. in eslint-config-standard      

    //enable all ESLint rules (for example to explore); todo: what with Typescipt?
    //'eslint:all',

    //ESLint's inbuilt "recommended" config - a small, sensible set of rules
    //'eslint:recommended',

    //disables a few of the recommended rules from the 'eslint:recommended' that
    //are already covered by TypeScript's typechecker
    //'plugin:@typescript-eslint/eslint-recommended',

    //Typescript ESLint "recommended" config - it's just like eslint:recommended,
    //except it only turns on rules from our TypeScript-specific plugin
    //'plugin:@typescript-eslint/recommended',

    //"type-aware linting" - rules reporting errors based on type information
    //recommended; takes longer if run from CMD for large project
    //see: https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/TYPED_LINTING.md
    //'plugin:@typescript-eslint/recommended-requiring-type-checking',

    //if I use it, then comment all above extensions i.e. 'eslint:recommended',
    //'plugin:@typescript-eslint/eslint-recommended',
    //and 'plugin:@typescript-eslint/recommended'
    'airbnb-typescript',
  ],

  rules: {
    //can be configured later
  }
};

我尝试整理我的代码:

D:\workspace\iw-components>npx eslint . --ext .ts

但我得到:

Failed to load plugin 'jsx-a11y' declared in '.eslintrc.js
 » eslint-config-airbnb-typescript
 » D:\workspace\iw-components\node_modules\eslint-config-airbnb\index.js
 » D:\workspace\iw-components\node_modules\eslint-config-airbnb\rules\react-a11y.js':
Cannot find module 'eslint-plugin-jsx-a11y'

Require stack:
- D:\workspace\iw-components\__placeholder__.js
4

2 回答 2

29

问题的原因是我错误地从eslint-config-airbnb-typescript包文档中复制了配置。

我改为extends: ['airbnb-typescript']现在extends: ['airbnb-typescript/base']ESLint 工作。

于 2020-05-22T22:59:00.247 回答
0

在 .eslintrc.yaml 中,添加

根:真

对我有用

于 2022-01-22T13:14:07.447 回答