Question

我刚刚下载了新的Visual Studio代码，我的第一印象非常积极。对于打字稿，intellisense工作得非常好。

然而，有一个奇怪的问题：VS Code似乎无法编译打字稿模块。

此代码：

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

import React = require("react");

使用

在cmd上完美编译

tsc --module commonjs main.ts

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

无法编译外部模块，除非＆＃34; -module＆＃34;提供了标志

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

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

更新

我已经添加了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"
}

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

更新

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

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

以下是输出：

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

错误TS5023：未知的编译器选项＆＃39; p＆＃39;。

"args": ["."],

错误TS6053：文件＆＃39; .ts＆＃39;没找到。

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：未知的编译器选项＆＃39; p＆＃39;。


"args": ["."],


错误TS6053：文件＆＃39; .ts＆＃39;没找到。

我从 npm 获得了 1.5.3 ，并且他正在使用 1.0.3 ，这是因为我已经在系统中安装了< em> Typescript 也在 Microsoft SDK 中，可从 PATH 访问。

该解决方案已从全局和用户 PATH Microsoft SDK 的 Microsoft SDK 中删除strong>从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文件并使用它来编译项目。

Answer 4

您需要在项目的根目录中创建一个tsconfig.json文件。

设置"module": "commonjs"

基本示例：

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

Answer 5

我遇到了同样的问题，在Steveover上找到了解决方案，由Steve Fenton提供： visual studio code compile on save。他的提议很优雅，符合当前的VS Code标准，并且如上所述立即工作。将其添加到文件 - ＆gt;偏好 - ＆gt;键盘快捷键为覆盖：

[
    {
        "key": "ctrl+s",          
        "command": "workbench.action.tasks.build" 
    }
]

Visual Studio代码：编译typescript模块

更新

更新

5 个答案: