typescript Visual Studio Code：编译打字稿模块
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30050262/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Visual Studio Code: compile typescript module
提问by lhk
I've just downloaded the new Visual Studio Code and my first impression is very positive. For typescript, intellisense works beautifully.
我刚刚下载了新的 Visual Studio Code，我的第一印象非常好。对于打字稿，智能感知工作得很好。
However, there is a strange problem: VS Code doesn't seem to be able to compile typescript modules.
但是，有一个奇怪的问题：VS Code 似乎无法编译打字稿模块。
This code:
这段代码：
/// <reference path="../definitions/react.d.ts"/>
import React = require("react");
compiles perfectly fine on the cmd, with
在 cmd 上编译得很好，
tsc --module commonjs main.ts
tsc --module commonjs main.ts
but within VS Code, the second line is highlighted in red and the editor complains:
但在 VS Code 中，第二行以红色突出显示，编辑器抱怨：
cannot compile external modules unless the "-module" flag is provided
除非提供“-module”标志，否则无法编译外部模块
Of course any typescript code which makes use of modules has to be compiled with this flag. But if the IDE is aware of the usage of modules, why doesn't it set the flag ? Typescript code without modules is compiled on save, without problems.
当然，任何使用模块的打字稿代码都必须使用此标志进行编译。但是如果 IDE 知道模块的使用，为什么不设置标志？没有模块的打字稿代码在保存时编译，没有问题。
I think I'm missing some compiler-setup config file. Is there such a thing ? Where can I find it ?
我想我缺少一些编译器设置配置文件。有这种事吗？我在哪里可以找到它？
UPDATE
更新
I've added the tsconfig.json file:
我添加了 tsconfig.json 文件：
{
"compilerOptions": {
"target": "ES5",
"module": "commonjs",
"sourceMap": true
}
}
This actually removes the error. Unfortunately the IDE no longer compiles my code. At first I thought the config.json would only silence the error message, but it does more than that. Intellisense now works in the sample file. If I type Reactthe autocompletion is triggered and apparently knows React because meaningful suggestions are displayed.
这实际上消除了错误。不幸的是，IDE 不再编译我的代码。起初我以为 config.json 只会使错误消息静音，但它的作用不止于此。Intellisense 现在可以在示例文件中使用。如果我键入React自动完成被触发并且显然知道 React 因为显示有意义的建议。
Now, why doesn't VS Code compile the file to js ? I've tried to configure the task runner to do that job, but it doesn't seem to work:
现在，为什么 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"
}
If I save the file, nothing happens, even if I explicitly run the build task, there's no response. The name of the task I edited is "tsc", I tried to run that, too. No effect. Then I changed the arguments to "args": ["--module commonjs","main.ts"], No response.
如果我保存文件，则没有任何反应，即使我明确运行构建任务，也没有响应。我编辑的任务的名称是“tsc”，我也尝试运行它。没有效果。然后我将参数更改为"args": ["--module commonjs","main.ts"]，无响应。
UPDATE
更新
The only way the task runner seems to work is with these two settings:
任务运行器似乎工作的唯一方法是使用这两个设置：
"args": ["${file}"], "isShellCommand": true,
"args": ["${file}"], "isShellCommand": true,
Here are the outputs:
以下是输出：
"args": ["-p"],"args": ["-p", "."],
"args": ["-p"],"args": ["-p", "."],
error TS5023: Unknown compiler option 'p'.
错误 TS5023：未知的编译器选项“p”。
"args": ["."],
"args": ["."],
error TS6053: File '.ts' not found.
错误 TS6053：未找到文件“.ts”。
采纳答案by khagesh
I also faced the same problem today. I followed this link http://blogs.msdn.com/b/typescript/archive/2015/04/30/using-typescript-in-visual-studio-code.aspxAfter following all setup steps, I ran this command on command line and it started generating JavaScript files
我今天也遇到了同样的问题。我按照这个链接 http://blogs.msdn.com/b/typescript/archive/2015/04/30/using-typescript-in-visual-studio-code.aspx按照所有设置步骤后，我在命令行，它开始生成 JavaScript 文件
npm install -g typescript
We need to ensure that we have node and npm installed and accessible through command line.
The reason I found it was not working because in tasks.jsonwe specify following options
我们需要确保我们已经安装了 node 和 npm，并且可以通过命令行访问。我发现它不起作用的原因是因为tasks.json我们指定了以下选项
"command": "tsc"
"isShellCommand": true,
So, visual studio code tries to run command tscon command line and it does not find tsc. So, installing typescript globally using npm solved the problem.
因此，visual studio 代码尝试tsc在命令行上运行命令，但找不到tsc. 因此，使用 npm 全局安装 typescript 解决了这个问题。
回答by Mirco Tracolli
I had the same problem in another project on VS Code and I figured out that VS Code was using a different version of Typescript.
我在 VS Code 的另一个项目中遇到了同样的问题，我发现 VS Code 使用的是不同版本的 Typescript。
Here are the outputs:
"args": ["-p"],"args": ["-p", "."],error TS5023: Unknown compiler option 'p'.
"args": ["."],error TS6053: File '.ts' not found.
以下是输出：
"args": ["-p"],"args": ["-p", "."],错误 TS5023：未知的编译器选项“p”。
"args": ["."],错误 TS6053：未找到文件“.ts”。
I had the 1.5.3from npmand he was using the 1.0.3, this because I had installed in the system Typescriptalso in Microsoft SDKsand it was accesible from the PATH.
我有来自npm的1.5.3，而他使用的是1.0.3，这是因为我已经在系统中安装了Typescript也在Microsoft SDK 中，并且它可以从PATH 访问。
The solution was remove from globaland userPATHthis Typescriptof Microsoft SDKsto access the newest one from npm that can manage -pargs.
解决方案是从全局和用户PATH中删除此Microsoft SDK 的Typescript，以便从 npm 访问可以管理-pargs的最新版本。
Try to execute tsccommand with only -v argumentto verify if it is the correct version.
尝试仅使用-v 参数执行tsc命令以验证它是否是正确的版本。
回答by Dirk B?umer
Regarding compiling the code, the tasks.json file should look like this:
关于编译代码，tasks.json 文件应如下所示：
{
"version": "0.1.0",
"command": "tsc",
"showOutput": "silent",
"windows": {
"command": "tsc.exe"
},
"args": ["-p", "."],
"problemMatcher": "$tsc"
}
If you are running under Windows and have tsc installed as a node module globally, change the windows section to:
如果您在 Windows 下运行并且将 tsc 全局安装为节点模块，请将 windows 部分更改为：
"windows": {
"command": "tsc",
"isShellCommand": true
}
The -p .args tell the tsc compiler to look for a tsconfig.json file in the root folder and use it to compile your project.
该-p .ARGS告诉TSC编译器寻找根文件夹中的文件tsconfig.json，并用它来编译你的项目。
回答by Ross Scott
You need to create a tsconfig.json file in the root of your project.
您需要在项目的根目录中创建一个 tsconfig.json 文件。
Set "module": "commonjs"
放 "module": "commonjs"
basic example:
基本示例：
{
"compilerOptions": {
"target": "ES5",
"module": "commonjs",
"sourceMap": true
}
}
回答by lucobada
I had the same problem and found the solution right here on stackoverflow, provided by Steve Fenton: visual studio code compile on save. His proposal is elegant, complies with the current VS Code standards and worked immediately as described. Add this to File -> Preferences -> Keyboard Shortcuts as an overwrite:
我遇到了同样的问题，并在 Steve Fenton 提供的 stackoverflow 上找到了解决方案： visual studio code compile on save。他的提议很优雅，符合当前的 VS Code 标准，并且按照描述立即生效。将此添加到 File -> Preferences -> Keyboard Shortcuts 作为覆盖：
[
{
"key": "ctrl+s",
"command": "workbench.action.tasks.build"
}
]
