如何设置 VSCode 内联显示打字稿错误 [英] How to setup VSCode to show typescript error inline
问题描述
我正在尝试将 ES6 项目迁移到打字稿.这是我第一次尝试在 NodeJS 中编写 typescript 模块.
到目前为止,它似乎在 Angular-CLI 中工作得更好.
我已经使用命令行 tsc
编译它,但我不确定如何在代码编辑器中显示错误和智能感知?
在一个目录中,我有如下所示的两个文件.当它编译它时,正如预期的那样抛出一个编译错误:Supplied parameters do not match any signature of call 目标.
.这可以.
但是 VSCode 没有在编辑器中显示任何错误,即使我故意犯了一个语法错误,比如去掉括号,或者输入这样的错误.如何让 VSCode 在 .ts 文件的编辑器中显示内联语法或编译器错误?
validation-error.ts
/*** 包装特定的验证错误.*/导出类 ValidationError 扩展错误 {私有类型:字符串;构造函数(错误:任何){超级(错误);Error.captureStackTrace(this, this.constructor);this.message = error.message;this.type = '验证错误';}}
然后我尝试编写简单的规范来测试工作流程:
validation-error.spec.ts
import { ValidationError } from './validation-error';import * as should from 'should';描述('验证错误',()=> {it('应该创建一个新实例', () => {const 实例 = 新的 ValidationError();应该存在(实例);});});
在此处
我仍在努力解决这个问题 - 我已经在 tasks.json
中设置了 tsc
以自动运行此作业:
<代码>{//参见 https://go.microsoft.com/fwlink/?LinkId=733558//有关tasks.json 格式的文档"taskName": "tsc","命令": "tsc",isShellCommand":真,"args": ["-w", "-p", "."],"problemMatcher": "$tsc-watch",回声命令":真}
我怀疑如果使用 $tsc-watch
正确报告了错误,该错误可能也会显示在编辑器中.当我运行任务时,我得到如下输出:
运行命令$ tsc -w -p .src/hello.ts(15,1): 错误 TS2346: 提供的参数与调用目标的任何签名都不匹配.下午 4:24:40 - 编译完成.监视文件更改.
但是在 Problems
视图中没有报告任何问题 - 即使显然存在编译器问题.
从文档的这个页面获得了 $tsc-watch
设置:
请尝试该设置并报告发生的情况.
I'm trying to migrate an ES6 project to typescript. This is my first attempt at writing a typescript module in NodeJS.
It seems to work better in Angular-CLI so far.
I've got it compiling using command line tsc
, but I'm not sure how to display errors and intellisense in the code editor?
In a directory I have the two files shown below. When it compiles it, as expected throws a compile error: Supplied parameters do not match any signature of cal
l target.
. This is fine.
But VSCode is not showing any errors in the editor, even if I make a deliberate syntax error like taking out a bracket, or type errors like this one. How do I get VSCode to show inline syntax or compiler errors in the editor for .ts files?
validation-error.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';
}
}
Then I'm trying to write simple spec to test out the workflow:
validation-error.spec.ts
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);
});
});
Edited Here:
I'm still plugging away at this - I've setup tsc
to run automatically with this job in 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
}
I suspect that if the errors were reported properly using $tsc-watch
, the error would probably also show up in the editor. When I run the task I get output like:
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.
But there are no problems reported in the Problems
view - even though clearly there's a compiler issue.
Got the $tsc-watch
setting from this page of the docs: https://code.visualstudio.com/docs/editor/tasks
Even without having installed TypeScript locally or globally, the following setup provides inline errors.
C:/temp
index.ts
tsconfig.json
index.ts
let x: number;
x = "foo";
tsconfig.json
{ }
Here is a screenshot that shows the inline error in x
.
Please try that setup and report back on what happens.
这篇关于如何设置 VSCode 内联显示打字稿错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!