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

     2023-02-22     268

关键词:

【中文标题】如何让 VSCode 显示 *not* 在编辑器中打开的文件的 TypeScript 错误?【英文标题】:How to get VSCode to show TypeScript errors for files *not* open in the editor? 【发布时间】:2019-08-07 15:27:50 【问题描述】:

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

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

我尝试在package.json 中添加"watch": "tsc --watch" 作为脚本,然后在集成终端窗格中执行npm run-script watch,但这有两个问题:

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

有没有更好的解决方案?

顺便说一句,这和Show project wide TypeScript problems/errors in webstorm 是同一个问题,但是关于 Visual Studio Code 而不是 webstorm。

【问题讨论】:

【参考方案1】:

截至 14.04.2020 普遍可用的 VS Code 中有一个实验性功能,可启用项目范围的问题报告。将以下内容添加到您的settings.json

"typescript.tsserver.experimental.enableProjectDiagnostics": true

它是实验性的,可能同时令人不知所措。

观看此space。

【讨论】:

对我有用的配置是"typescript.tsserver.experimental.enableProjectDiagnostics": true。该团队正在积极开展这项工作。 @DawsonB 谢谢你的信息,我已经更新了票 我添加了这个设置,重启 VS Code 但它没有显示任何问题? (虽然我有一些)【参考方案2】:

很遗憾,截至 2019 年 11 月,VS Code 不支持开箱即用。见https://github.com/Microsoft/vscode/issues/13953。

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

以下是 tasks.json 的示例配置。请注意,下面 sn-p 中的“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://***.com/a/58866185/126352

此解决方案改编自@molinx 在上面链接的 GitHub 问题中的回答,并感谢@kumar303 在下面的评论进行了改进。

【讨论】:

添加了 1.30 版 "runOn": "folderOpen" code.visualstudio.com/updates/v1_30#_run-on-folder-open @kumar303,这是一个有用的改进!我相应地更新了我的答案。谢谢! 此功能之前是否正常工作,只是被新更新淘汰了? 我需要稍微更改任务以使其在 Windows "command": "call" 和 args 中的 tsc 路径(如 "args": ["node_modules/.bin/tsc", "--watch", "--noEmit", "--project", "www"],)中工作

如何设置 VSCode 以内联显示打字稿错误

...。我已经使用命令行tsc编译了它,但我不确定如何在代码编辑器中显示错 查看详情

如何让vscode同时打开(显示)多个项目

...比较麻烦的事情:比如每次同一个窗口只能打开一个项目;如何才能让多个不同路径的项目同时显示在左侧资源栏里面呢?研究了好几天终于解决了.如下图所示,两个项目同时在左侧显示:首先新版的VSCode在添加、选择或者创建了项目... 查看详情

如何让 Q_PROPERTY 在设计视图中显示

...Y的QPushButton派生的类,但它们没有出现在设计模式的属性编辑器中。在设计视图中有一个QPushButton提升为我的自定义类,我希望属性自动显示在属性编辑器中,至少是类型为“int”的属性。我很可能误 查看详情

使用 typescript-eslint 在 VSCode 编辑器中未显示 Typescript 错误

】使用typescript-eslint在VSCode编辑器中未显示Typescript错误【英文标题】:TypescripterrorsnotshowinginVSCodeeditorusingtypescript-eslint【发布时间】:2020-10-0214:22:21【问题描述】:我的问题是我无法使用eslint和@typescript-eslint在编辑器中显示打字... 查看详情

如何在 VSCode 中打开浏览器,就像另一个编辑器选项卡一样

】如何在VSCode中打开浏览器,就像另一个编辑器选项卡一样【英文标题】:HowtoopenabrowserwithinVSCodejustlikeanothereditortab【发布时间】:2018-03-0313:31:19【问题描述】:对于VSCode扩展,我希望在VSCode中打开浏览器而不是在外部打开浏览... 查看详情

在vscode编辑器中,如何实现手机端调试页面

参考技术A      要想在移动端调试,首先得本地起一个服务,这时候就用到了liveserver插件。 查看详情

vscode如何调试python

...Python扩展提供的最常见配置。您可以使用列表和launch.json编辑器中显示的“添加配置”命令选择要包含在launch.json中的其他配置。当您使用该命令时,VSCode会提示您所有可用配置的列表(请务必向下滚动以查看所有Python选项):... 查看详情

如何让我的 UIView 在 Xcode 的 Storyboard 编辑器中可见?

】如何让我的UIView在Xcode的Storyboard编辑器中可见?【英文标题】:HowcanImakemyUIViewvisibleinXcode\'sStoryboardeditor?【发布时间】:2012-05-3120:27:30【问题描述】:请查看在Xcode中显示部分情节提要的屏幕截图。它是一个控制器。在与控制... 查看详情

如何开发一个vscode插件

...陌生,它插件市场中拥有很多开发者开发的插件,让这个编辑器能力的潜力变得无限可能。如果你觉得vscode的功能不能满足你的要求,你完全可以自己去开发拓展一个插件,来增强自己vscode的功能。我现在有一个需求,就是可以... 查看详情

怎么让vscode支持es7特性

...换行”选项。设置此选项后,较长的行中超出当前“代码编辑器”窗口宽度的部分会显示在下一行中。出于某些原因(例如,为方便使用行号)清除此选项后,可以滚动到右侧以查看较长行的末尾部分。注意:显示的对话框和菜... 查看详情

VSCode 在构建之前不显示错误

...时间】:2021-02-2613:45:16【问题描述】:我使用VSCode(代码编辑器,而不是IDE)用于C++,只有Microsoft的C++扩展,今天我在这里遇到了一个问题。当我编写错误的语法时,“问题”面板不会显示错误。它只显示构建代码的错误。早些... 查看详情

如何在 vscode 中减小编辑器文件的宽度,以便不必向右滚动即可到达段落末尾

】如何在vscode中减小编辑器文件的宽度,以便不必向右滚动即可到达段落末尾【英文标题】:HowdoIreducethewidthofmyeditorfileinvscodesothatIdon\'thavetoscrolltotherighttoreachtheendofaparagraph【发布时间】:2020-07-0908:51:37【问题描述】:似乎我在vsc... 查看详情

如何在mac上完全卸载vscode

...,在删除所有这些并下载一个新副本后,我安装并打开了编辑器,编辑器记住了我上一个项目。对我来说,这意味着我需要 查看详情

如何在移动端的cad看图中让图纸居中显示?

...在很多CAD行业的小伙伴们都有这样的一个烦恼,那就是在编辑器完CAD图纸后,要在CAD看图软件中对dwg格式的图纸进行查看,但是在查看的过程中有的查看不到,这是怎么回事了,那是因为图纸内容太大,没有让图纸居中的缘故,... 查看详情

如何在vscode开发slicer插件的过程中进行调试?

本文由Markdown语法编辑器编辑完成。1.前言在开发slicer插件的过程中,经常需要了解程序运行过程中的中间值。一般有两种方法,第一种比较原始的方法是,在需要输出变量值的时候,用print()或logging.info()函数࿱... 查看详情

如何在导航栏中显示编辑按钮

】如何在导航栏中显示编辑按钮【英文标题】:HowtoShowEditbuttoninNavigationbar【发布时间】:2014-08-2910:58:35【问题描述】:我正在使用这行代码self.navigationItem.leftBarButtonItem=self.editButtonItem;但是导航栏中没有出现编辑按钮。使用xib文... 查看详情

如何使用 VSCode 远程编辑网站文件?

...我主要将其用于CSS更改,但也开始使用PHP。我试图让远程编辑器工作,但它不会拾取我放在/home文件夹中的.remote文件。这些说明并没有真正提供有关设置的详细信息。我该怎么办?【 查看详情

如何在一列中显示编辑删除按钮?

】如何在一列中显示编辑删除按钮?【英文标题】:Howtoshoweditdeletebuttoninonecolumn?【发布时间】:2020-12-0902:59:43【问题描述】:实际上我面临一个小问题。我想在一列中显示编辑和删除按钮,但我无法做到这一点。让我与您分享... 查看详情