ESLint - TypeScript용 "no-used-vars" 설정

ESLint - TypeScript용 "no-used-vars" 설정

다음과 같은 설정으로 모든 TypeScript 프로젝트에서 ESLint를 사용합니다.

  "extends": ["airbnb", "prettier", 'plugin:vue/recommended'],
  "plugins": ["prettier"],
  "parserOptions": {
  "parser": "@typescript-eslint/parser",
  "ecmaVersion": 2018,
  "sourceType": "module"
  },

• 많은 관습 규칙들.또한 TypeScript 지원을 위해 다음과 같은 종속성도 설치했습니다.

    "@typescript-eslint/eslint-plugin": "^1.7.0",
    "@typescript-eslint/parser": "^1.7.0",
  

그러나 ESLint의 가장 유용한 규칙 중 하나인 https://eslint.org/docs/rules/no-unused-vars,은 TypeScript 프로젝트에 대해 매우 적절하게 구성되어 있지 않은 것 같습니다.예를 들어 열거형을 내보낼 때 열거형이 선언된 파일에서 사용되지 않는다는 경고가 규칙에서 표시됩니다.

export enum Foo {
   Bar,
}

마찬가지로 타입으로 사용하는 인터페이스 또는 클래스를 Import하면 실제 Import 행에서 no-unused-vars가 다시 불만을 제기합니다.

Foo.ts에서

export interface Foo {
   bar: string;
}

인바.ts

import { Foo } from './Foo'
const bar: Foo = { bar: 'Hello' };

이들 2가지 경우를 고려하여 no-used-vars 규칙을 설정하는 방법이 있습니까?이러한 경우를 제외하고 규칙 집합 전체에서 가장 유용한 규칙 중 하나이기 때문에 규칙을 비활성화하는 것은 좋아하지 않습니다.

이미 오류 대신 경고만 하도록 규칙을 다운그레이드했지만 모든 문서에 경고가 채워져도 esLint를 사용하는 목적은 사라집니다.

여기에 제시된 //eslint-disable-line으로 모든 문서를 채우는 것도 잘못된 해결책으로 보입니다.

의 용도는 다음과 같습니다."plugin:@typescript-eslint/eslint-recommended"이치노아마 한 명이 사용하는 것이 더 나을 것이다."@typescript-eslint/no-unused-vars"에슬린트

{
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint",
  ],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
  ],
  "rules": {
    "no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars": ["error"]
  }
}

참고: 위의 내용을 변경한 후 서버를 재시작하십시오.

레퍼런스 - https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-unused-vars.md

매뉴얼에 기재되어 있지만 '확장' 속성에 몇 가지 사항을 추가하면 no-used-vars와 같이 ESLint에서 권장하는 두 가지 규칙을 모두 사용할 수 있으며 실제로 Typescript에서 사용할 수 있습니다.다음과 같은 경우:

"extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended"
    ],

@typescript-eslint/recommended는 eslint:recommended가 Typescript 구조를 효과적으로 처리할 수 있도록 하는 것으로 보입니다.다른 내선번호에 어떤 영향을 미칠지 모르겠습니다.

의 TypeScript했는데, TypeScript/ES-Lint를 실험 해 낸 되었습니다.no-unused-vars과 함께 있다.@typescript-eslint/no-unused-vars-experimental드디어 내 기대대로 되는구나

제 쪽에서 변경하기 전에는 인터페이스/유형을 사용할 때 이러한 변수들은 사용되지 않는다고 하는 잘못된 오류가 여러 번 있었습니다(물론 변수가 아니라 인터페이스/유형이기 때문에 사용되지 않습니다).코드 자체에 대해 궁금하신 점이 있다면, 이 실험 규칙을 추가한 PR입니다. 이렇게 해서 규칙을 찾았습니다.

여기 업데이트의 서브셋이 있습니다..eslintrc파일

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": {
    "@typescript-eslint/no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars-experimental": "error",
    "no-unused-vars": "off"
  }
}

드디어 정상으로 돌아왔습니다.

편집 (2021년 1월)

아래 코멘트에서 Brad(프로젝트 관리인)가 언급한 바와 같이 이는 일시적인 해결책으로 현재는 권장되지 않습니다.그의 코멘트(아래)에서, 우리는 이제 직접 사용할 수 있다.@typescript-eslint/no-unused-vars같은 의도된 행동에 대해서요브래드한테 알려줘서 고마워또한, 다시 로의 전환을 확인할 수도 있습니다.@typescript-eslint/no-unused-vars(코드를 업데이트하고 이제 모든 것이 정상입니다)

이것은 방법이 아니니 피해야 한다. @typescript-eslint/no-unused-vars-experimental는 폐지되어 다음 메이저에서 삭제됩니다.최신 버전의 공구로 업데이트하고 사용만 하면 됩니다.@typescript-eslint/no-unused-vars출처:저는 그 프로젝트의 관리자입니다.

UPDATED ANSWER since Jan. 2021

여기 최신 정보가 있습니다..eslintrc나에게 맞는 파일:)

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": {
    "@typescript-eslint/no-unused-vars": "error",
    "no-unused-vars": "off"
  }
}

문제는 데코레이터를 사용하고 명확성을 위해 적절한 이름을 가진 변수를 사용하는 것이었습니다. 예를 들어 다음과 같습니다.

@OneToMany((type) => Employee)대신@OneToMany(() => Employee)

TypeScript의 일반적인 솔루션은 다음과 같이 밑줄을 붙이는 것입니다.

@OneToMany((_type) => Employee)

ESLint도 같은 것을 받아들일 수 있습니다.

.eslintrc.js

module.exports = {
  ...
  rules: {
    '@typescript-eslint/no-unused-vars': ['warn', { 'argsIgnorePattern': '^_' }]
    ....
  },
};

당신은 가지고 있다parser내부에 내포된parserOptions이렇게 형제지간이어야 합니다.

"parser": "@typescript-eslint/parser",
"parserOptions": {
    "ecmaVersion": 2018,
    "sourceType": "module"
},

에 대해서는no-unused-vars이 버그는 현재 진행 중입니다.@typescript-eslint: https://github.com/typescript-eslint/typescript-eslint/issues/363

업그레이드@typescript-eslint/eslint-plugin그리고.@typescript-eslint/parser3.x에서 최신 4.x로 변경되어 문제가 해결했습니다.

예를 들어 YAML 구성 사용 시 TypeScript에서 정상적으로 동작하는 미사용 vars를 원하는 사용자용..eslintrc.yaml, 다음과 같이 표시됩니다.

rules:

  "@typescript-eslint/no-unused-vars":
  - warn
  - argsIgnorePattern: "^_"                # <-- NOTE!
    varsIgnorePattern: "^_"
    caughtErrorsIgnorePattern: "^_"

  no-unused-vars: # disabled but see typescript-eslint/no-unused-vars
  - off
  ...

또한 작업 규칙 /eslint no-unused-vars: ["error", {varsIgnorePattern": "[I]gnored" }/
.eslintrc.json 파일에 다음과 같이 추가할 수 있습니다(이것은 대문자로 시작하는 모든 문자열을 무시하기 위한 것입니다).

    "rules": {
        "no-unused-vars": [
          "error",
          {
            "varsIgnorePattern": "^[A-Z]"
          }
        ],
    }

자세한 내용과 속성은 이 링크를 참조하십시오.

몇 년이 지난 후에도 여전히 같은 오류가 발생합니다.왜 작동하지 않는지 확인하려고 하면 답답합니다.여기서 가능한 구성을 많이 시도해 본 후, 드디어 사용할 수 있게 되었습니다.나처럼 어려운 사람이 있을까 봐!

eslintrc.js

module.exports = {
    env: {
        browser: true,
        node: true,
    },
    parser: "@typescript-eslint/parser",
    extends: [
        "eslint:recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "prettier",
        "plugin:prettier/recommended",
        "plugin:@typescript-eslint/recommended",
    ],
    parserOptions: {
        ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
        project: "tsconfig.eslint.json",
        tsconfigRootDir: __dirname,
        sourceType: "module", // Allows for the use of imports
    },
    plugins: ["@typescript-eslint", "@typescript-eslint/tslint", "import", "unused-imports"],

    rules: {
        "@typescript-eslint/no-unused-vars": "off",
        "@typescript-eslint/no-unused-vars-experimental": "error",
        "no-unused-vars": "off",
        "import/order": "error",
        "no-console": ["warn", { allow: ["warn", "error"] }],
        eqeqeq: ["error", "always"],
        "no-else-return": "error",
    },
    settings: {
        "import/resolver": {
            node: {
                extensions: [".js", ".jsx", ".ts", ".tsx"],
                moduleDirectory: ["node_modules", "src/"],
            },
        },
    },
};

이 구성을 사용하고 있으며 정상적으로 동작합니다.

{
  "env": {
    "browser": true,
    "es2021": true,
    "node": true,
    "jest": true
  },
  "extends": ["airbnb-base", "prettier"],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaVersion": "latest",
    "sourceType": "module"
  },
  "plugins": ["@typescript-eslint", "jest"],
  "rules": {
    "import/extensions": "off",
    "@typescript-eslint/no-unused-vars": ["error"]
  },
  "settings": {
    "import/resolver": {
      "node": {
        "extensions": [".js", ".jsx", ".ts", ".tsx"]
      }
    }
  }
}

언급URL : https://stackoverflow.com/questions/57802057/eslint-configuring-no-unused-vars-for-typescript