如何让 VSCode 显示在编辑器中*未*打开的文件的 TypeScript 错误？

IT技术 reactjs typescript visual-studio-code create-react-app
2021-05-11 08:48:11

在我的create-react-app@2.1.8TypeScript/React 应用程序中，TS 编译器错误仅显示在我在 VS Code 编辑器中打开的文件的问题窗格中。因此，我有时在实际运行应用程序之前不会发现错误。

如何在打开工作区或将更改保存到文件时让 TypeScript 自动检查所有代码文件中的编译器错误？

我试过在一个集成的终端窗格中"watch": "tsc --watch"作为脚本添加package.json然后在做npm run-script watch，但这有两个问题：

  • 错误显示在终端窗格中，但不填充 VSCode 中的问题窗格
  • 我必须手动运行它，而不是在工作区加载时自动启动

有更好的解决方案吗？

顺便说一句，这与在 webstorm 中显示项目范围的 TypeScript 问题/错误相同，但关于 Visual Studio Code 而不是 webstorm。

2个回答

截至2020 年 4 月 14 日，普遍可用的VS Code 中有一项实验性功能，可以启用项目范围的问题报告。将以下内容添加到您的settings.json:

"typescript.tsserver.experimental.enableProjectDiagnostics": true

它是实验性的，可以同时压倒性的和平庸的。

注意这个空间。

截至 2019 年 11 月，不幸的是，开箱即用的 VS Code 不支持此功能。请参阅https://github.com/Microsoft/vscode/issues/13953。

我能找到的最佳解决方法是向 tasks.json 添加一个将运行的任务tsc --watch，并将其配置为在工作区或文件夹打开时运行。

下面是 tasks.json 的示例配置。请注意，以下代码段中的“www”指的tsconfig.json是您要检查的文件夹。将其替换为您自己的文件夹的名称，相对于您的工作区的根目录。

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "tsc watch",
            "type": "shell",
            "command": "./node_modules/.bin/tsc",
            "isBackground": true,
            "args": ["--watch", "--noEmit", "--project", "www"],
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "presentation": {
                "reveal": "never",
                "echo": false,
                "focus": false,
                "panel": "dedicated"
            },
            "problemMatcher": "$tsc-watch",
            "runOptions": {
                "runOn": "folderOpen"
            }
        }
    ]
}

请注意，默认情况下似乎未启用自动运行任务。要选择自动运行任务，请按照此处的说明操作：https : //stackoverflow.com/a/58866185/126352

此解决方案改编自@molinx在上面链接的 GitHub 问题中的回答，并且由于下面的@kumar303评论而得到改进。

其它你可能感兴趣的问题
上一篇如何正确读取 3D 打印机的尺寸？ 下一篇何时在 3D 打印上使用 Wave Bonding 与 Raft？