VS Code：在保存文件时观看打字稿

Posted 2023-03-13

【中文标题】VS Code：在保存文件时观看打字稿

【英文标题】：VS Code: watch typescript on save file

【发布时间】：2016-04-09 19:36:20

【问题描述】：

在 Visual Studio Code 中，我在 tsconfig.json 的代码中有以下代码

    "version": "1.6.0",
    "compilerOptions": 
        "target": "es5",
        "module": "commonjs",
        "sourceMap": true,
        "watch": true,
        "experimentalAsyncFunctions": true,
        "isolatedModules": false,
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "declaration": false,
        "noImplicitAny": false,
        "removeComments": true,
        "noLib": false,
        "preserveConstEnums": true,
        "suppressImplicitAnyIndexErrors": true
    ,
    ...

如您所见，watch 选项为 true。好吧，看起来这还不足以像 atom-typescript 一样将 .ts 文件编译为 .js 。基本上，新编译的.js在保存.ts时应该在.ts文件的同一目录下。

另外，我想避免在我的根项目中使用 gulp，因为我已经将 gulpfile.coffee 用于其他方式。有人有线索吗？

【参考方案1】：

使用最新版本的 VS Code 1.7.2 和 Typescript 2.0.10，您只需在 .vscode/tasks.json 中包含以下代码

    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": ["-w", "-p", "."],
    "showOutput": "silent",
    "isWatching": true,
    "problemMatcher": "$tsc-watch"

不需要tsconfig.json 中的watch 选项。

【参考方案2】：

您必须在 .vscode 文件夹中定义一个如下所示的 tasks.json：

    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "showOutput": "silent",
    "args": ["HelloWorld.ts"],
    "problemMatcher": "$tsc"

您可以在此处找到有关它的更多信息：https://code.visualstudio.com/Docs/languages/typescript