eslint 未检测到 TS 错误

Question

我有一个使用 typescript 的 nextJS 应用程序。我使用 VSCode 进行开发。我注意到，当我打开一个有错误的文件时，VSCode 按预期显示 TS 错误，但eslint事实并非如此。

\n

例如，这是我的 VSCode 错误：

\n

\n

但这是我的 linting 结果：

\n

\xe2\x96\xb6 yarn lint\n\nyarn run v1.22.10\n$ eslint .\n(node:83388) ExperimentalWarning: Conditional exports is an experimental feature. This feature could change at any time\n(node:83388) ExperimentalWarning: Package name self resolution is an experimental feature. This feature could change at any time\n\xe2\x9c\xa8  Done in 5.26s.\n

\n

以下是一些可能有助于识别问题的文件：

\n

.eslintrc.js：

\n

module.exports = {\n  plugins: [\n    \'@typescript-eslint\',\n  ],\n  extends: [\n    \'airbnb-typescript\',\n    \'airbnb/hooks\',\n    \'plugin:@typescript-eslint/recommended\',\n    \'plugin:@typescript-eslint/recommended-requiring-type-checking\',\n  ],\n  ignorePatterns: [\n    \'app.js\',\n    \'.eslintrc.js\',\n    \'jest.config.js\',\n    \'babel.config.js\',\n    \'/plugins\',\n  ],\n  parser: \'@typescript-eslint/parser\',\n  parserOptions: {\n    project: \'./tsconfig.json\',\n  },\n  rules: {\n    \'react/require-default-props\': [\'warn\', { ignoreFunctionalComponents: true }],\n  },\n  overrides: [\n    {\n      files: [\'*.spec.tsx\', \'*.stories.tsx\'],\n      rules: {\n        \'import/no-extraneous-dependencies\': \'off\',\n      }\n    }\n  ]\n};\n\n

\n

tsconfig.json：

\n

{\n  "compilerOptions": {\n    "target": "ES2016",\n    "lib": [\n      "dom",\n      "dom.iterable",\n      "esnext"\n    ],\n    "allowJs": true,\n    "skipLibCheck": true,\n    "strict": true,\n    "forceConsistentCasingInFileNames": true,\n    "noEmit": true,\n    "esModuleInterop": true,\n    "module": "esnext",\n    "moduleResolution": "node",\n    "resolveJsonModule": true,\n    "isolatedModules": true,\n    "jsx": "preserve"\n  },\n  "include": [\n    "next-env.d.ts",\n    "**/*.ts",\n    "**/*.tsx"\n  ],\n  "exclude": [\n    "node_modules"\n  ]\n}\n

\n

bable.config.js：

\n

const path = require(\'path\');\n\nmodule.exports = {\n  presets: [\n    [\n      \'next/babel\',\n      {\n        \'styled-jsx\': {\n          plugins: [path.join(__dirname, \'/plugins/styled-jsx-plugin-sass.js\')],\n        }\n      }\n    ]\n  ],\n  plugins: [\'inline-react-svg\']\n}\n

\n

package.json 脚本：

\n

{\n"scripts": {\n    "preinstall": "npx only-allow npm",\n    "dev": "next dev",\n    "build": "next build",\n    "start": "next start",\n    "storybook": "start-storybook -s ./public -p 6006",\n    "build-storybook": "build-storybook",\n    "lint": "eslint .",\n    "test": "jest"\n  },\n}\n

\n

我将非常乐意提供任何进一步的信息来帮助解决问题。先感谢您！

\n

Answer 1

经过更多研究，我发现这个 github 问题也有同样的问题： https: //github.com/typescript-eslint/typescript-eslint/issues/352

其中答案是：

我们故意不关心由于类型检查错误而产生的错误。我们只关心代码在语法上是否有效（即可以无错误地解析），而不关心它在语义上是否有效（即不关心它是否是声音类型）

如果您希望对代码进行类型检查 - 请使用tsc（或为您的特定构建链构建的工具之一）。

所以我的解决方案是将我的lint脚本编辑为：

{
  "scripts": {
    "lint": "tsc --noEmit && eslint .",
  },
}

该--noEmit标志告诉命令不要生成任何文件。