Visual Studio代码:编译typescript模块

Question

我刚刚下载了新的Visual Studio Code,我的第一印象非常积极.对于打字稿,intellisense工作得很漂亮.

但是,有一个奇怪的问题:VS Code似乎无法编译typescript模块.

这段代码:

/// <reference path="../definitions/react.d.ts"/>

import React = require("react");

在cmd上编译完全正常

tsc --module commonjs main.ts

但在VS Code中,第二行以红色突出显示,编辑抱怨:

除非提供"-module"标志,否则无法编译外部模块

当然,任何使用模块的打字稿代码都必须使用此标志进行编译.但是如果IDE知道模块的用法,为什么不设置标志呢？没有模块的打字稿代码在保存时编译,没有问题.

我想我错过了一些编译器设置配置文件.有这样的事吗？我在哪里可以找到它？

UPDATE

我添加了tsconfig.json文件:

{
    "compilerOptions": {
        "target": "ES5",
        "module": "commonjs",
        "sourceMap": true
    }
}

这实际上消除了错误.不幸的是,IDE不再编译我的代码.起初我以为config.json只会使错误消息静音,但它确实不止于此.Intellisense现在可以在示例文件中使用.如果我键入React自动完成被触发并且显然知道React,因为显示了有意义的建议.

现在,为什么VS Code没有将文件编译为js？我已经尝试配置任务运行器来完成这项工作,但它似乎不起作用:

{
    "version": "0.1.0",

    // The command is tsc.
    "command": "tsc",

    // Show the output window only if unrecognized errors occur. 
    "showOutput": "silent",

    // Under windows use tsc.exe. This ensures we don't need a shell.
    "windows": {
        "command": "tsc.exe"
    },

    // args is the HelloWorld program to compile.
    "args": ["--module commonjs","${file}"],

    // use the standard tsc problem matcher to find compile problems
    // in the output.
    "problemMatcher": "$tsc"
}

如果我保存文件,没有任何反应,即使我明确地运行构建任务,也没有响应.我编辑的任务的名称是"tsc",我也试图运行它.没有效果.然后我将参数更改为"args": ["--module commonjs","main.ts"]"无响应".

UPDATE

任务运行器似乎工作的唯一方法是使用以下两个设置:

"args": ["${file}"], 
"isShellCommand": true, 

以下是输出:

• "args": ["-p"],
• "args": ["-p", "."],

错误TS5023:未知的编译器选项'p'.

• "args": ["."],

错误TS6053:找不到文件'.ts'.

Answer 1

我今天也遇到了同样的问题.我按照这个链接 http://blogs.msdn.com/b/typescript/archive/2015/04/30/using-typescript-in-visual-studio-code.aspx 完成所有设置步骤后,我运行了此命令命令行,它开始生成JavaScript文件

npm install -g typescript

我们需要确保安装了node和npm并通过命令行访问.我发现它不起作用的原因是因为tasks.json我们指定了以下选项

"command": "tsc"
"isShellCommand": true,

因此,visual studio代码尝试tsc在命令行上运行命令,但它找不到tsc.因此,使用npm全局安装typescript解决了这个问题.

Answer 2

我在VS Code的另一个项目中遇到了同样的问题,我发现VS Code使用的是不同版本的Typescript.

以下是输出:

• "args": ["-p"],
• "args": ["-p", "."],

错误TS5023:未知的编译器选项'p'.

• "args": ["."],

错误TS6053:找不到文件'.ts'.

我从npm获得了1.5.3并且他使用的是1.0.3,这是因为我在Microsoft SDK中也安装了系统Typescript,并且可以从PATH访问.

该解决方案是从删除全局和用户 PATH这个打字稿的微软的SDK从NPM可以管理访问最新的一个-p ARGS.

尝试仅使用-v参数执行tsc命令以验证它是否是正确的版本.

Answer 3

关于编译代码,tasks.json文件应该如下所示:

{
    "version": "0.1.0",
    "command": "tsc",    
    "showOutput": "silent",
    "windows": {
        "command": "tsc.exe"
    },
    "args": ["-p", "."],    
    "problemMatcher": "$tsc"
}

如果您在Windows下运行并将tsc全局安装为节点模块,请将windows部分更改为:

"windows": {
    "command": "tsc",
    "isShellCommand": true
}

该-p .ARGS告诉TSC编译器寻找根文件夹中的文件tsconfig.json,并用它来编译你的项目.