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

Question

我正在尝试将ES6项目迁移到打字稿。这是我在NodeJS中编写打字稿模块的第一次尝试。

到目前为止，它似乎在Angular-CLI中效果更好。

我已经使用命令行对其进行了编译tsc，但是我不确定如何在代码编辑器中显示错误和智能提示？

在目录中，我有下面显示的两个文件。编译时，按预期方式会引发编译错误：Supplied parameters do not match any signature of cal l target.。这可以。

但是VSCode不会在编辑器中显示任何错误，即使我犯了故意的语法错误（如取出括号）或键入此类错误。如何使VSCode在.ts文件的编辑器中显示内联语法或编译器错误？

验证错误

/**
 * Wrapper for a particular validation error.
 */
export class ValidationError extends Error {
  private type: string;

  constructor(error: any) {
    super(error);
    Error.captureStackTrace(this, this.constructor);
    this.message = error.message;
    this.type = 'ValidationError';
  }
}

然后，我尝试编写简单的规范来测试工作流程：

验证错误

import { ValidationError } from './validation-error';
import * as should from 'should';

describe('Validation Error', () => {
  it('should create a new instance', () => {
    const instance = new ValidationError();
    should.exist(instance);
  });
});

在这里编辑：

我仍然对此不屑一顾-我已设置tsc为在以下作业中自动运行tasks.json：

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "taskName": "tsc",
  "command": "tsc",
  "isShellCommand": true,
  "args": ["-w", "-p", "."],
  "problemMatcher": "$tsc-watch",
  "echoCommand": true
}

我怀疑如果使用正确报告$tsc-watch了错误，则该错误也可能会显示在编辑器中。当我运行任务时，我得到如下输出：

running command$ tsc -w -p .
src/hello.ts(15,1): error TS2346: Supplied parameters do not match any signature of call target.
4:24:40 PM - Compilation complete. Watching for file changes.

但是Problems视图中没有报告任何问题-即使很明显存在编译器问题。

$tsc-watch从文档的此页面获取设置：https : //code.visualstudio.com/docs/editor/tasks

Answer 1

对我来说，问题是通过在VSCode设置中将Typescript验证设置为true来解决的：

"typescript.validate.enable": true,

我过去在工作区设置中将其关闭，却忘记了！

因此，请确保再次检查您的用户设置，工作空间设置或文件夹设置中此设置未设置为false 。

例如，我试图开始工作的规则是检查未定义的变量，当我将validate设置为true时，该变量立即得到修复。

Answer 2

我遇到了这个问题，通过添加"typescript.validate.enable": true到 .vscode 目录中的本地 settings.json 文件来解决它。我的设置告诉我，打字稿验证器已在全局范围内为 VS 代码启用，但在添加本地设置文件之前，我无法看到内联 TS 错误。

Answer 3

其他答案（大多数在 2020 年之前）对我不起作用。

根据Microsoft VS Code 存储库中的此功能请求，执行以下步骤：

1. 在你的settings.json中添加：

"typescript.validate.enable": true,
"typescript.tsserver.experimental.enableProjectDiagnostics": true,

2. 在 tsconfig.json 添加：

"include": [
    "src",
    "global.d.ts",
  ],
"exclude": [
    "node_modules",
    "plugins",
    "public"
  ]

等待一段时间（或重新启动 VS Code），以便查看打开的文件中显示并添加到问题面板中的错误列表。

Answer 4

即使没有在本地或全局安装 TypeScript，以下设置也会提供内联错误。

C:/temp
  index.ts
  tsconfig.json

索引.ts

let x: number;
x = "foo";

tsconfig.json

{ }

这是显示 中的内联错误的屏幕截图x。

请尝试该设置并报告发生的情况。