TypeScript 编译器不遵循 ESLint 规则

Question

我遇到了一个问题，即由 TypeScript 编译器生成的 JavaScript 不遵循为项目设置的 ESLint 规则。

这是 TypeScript 配置（tsconfig.json）：

{
    "compilerOptions": {
        "lib": ["es2015"],
        "module": "commonjs",
        "outDir": "dist",
        "sourceMap": true,
        "strict": true,
        "target": "es2015"
    },
    "include": [
        "src"
    ]
}

这是 ESLint 配置（.eslintrc.json）：

{
    "env": {
        "browser": true,
        "commonjs": true,
        "es6": true,
        "node": true
    },
    "extends": [
        "standard",
        "plugin:@typescript-eslint/recommended"
    ],
    "globals": {
        "Atomics": "readonly",
        "SharedArrayBuffer": "readonly"
    },
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "ecmaVersion": 11
    },
    "plugins": [
        "@typescript-eslint"
    ],
    "rules": {
    }
}

我正在使用 VS Code，在编辑 TypeScript 时，会显示来自 ESLint 的错误。 但是，我遇到的问题是：编译器将允许不符合 ESLint 规则的代码通过，并且生成的 JavaScript 代码也不符合规则。 例如，它会在不应该的时候用分号终止每条语句。

我是 TypeScript 的新手，我很确定这是我做错的基本问题，但是（到目前为止）在任何文档中都找不到此信息。

感谢您的指导。

Answer 1

ESLint 不负责对您的 typescript 代码进行类型检查。 您应该依靠 TypeScript 来检查 tslint 之类的类型错误（相应地进行配置）。 示例 tslint.json

{
"rulesDirectory": ["node_modules/codelyzer"],
"rules": {
    "arrow-return-shorthand": true,
    "callable-types": true,
    .....
 }

Answer 2

ESLint不涉及捆绑构建管道。 但是，您可以在捆绑构建之前运行 eslint 以使整个构建失败，以防出现 linting 问题。

如果您想对生成的代码进行任何更改，应使用 webpack 插件 / typescript 来完成。

因此，例如，如果您想删除分号，这可能应该使用您的压缩器/压缩器来完成。 比如uglifyjs ： https://github.com/mishoo/UglifyJS#output-options

Answer 3

您所缺少的只是 eslint 文件的parserOptions上的属性调用project 。

....
“parserOptions”:{
  .....
  “project”: [“./tsconfig.json”]
.....

您也可以向这两个文件添加更多内容