如何让 Visual Studio 2017 在内置类库项目中编译 TypeScript（新的 .net 核心样式 .csproj）答案

【问题标题】：How to get Visual Studio 2017 to compile TypeScript on build in class library project (new .net core style .csproj)如何让 Visual Studio 2017 在内置类库项目中编译 TypeScript（新的 .net 核心样式 .csproj）
【发布时间】：2018-01-25 15:49:00
【问题描述】：

目前正在运行 VS 2017 15.3.5 和 Typescript 2.5.2 SDK。如何让 TypeScript 在构建时编译（常规 MSBuild）。 csproj 是新的“.net core 风格”，项目类型是类库。

【问题讨论】：

标签： typescript msbuild visual-studio-2017

【解决方案1】：

here是对包括msbuild在内的更多构建工具的描述：

最简单的方法：

右键单击 -> 管理 NuGet 包
搜索 Microsoft.TypeScript.MSBuild
点击安装
安装完成后，重建！

为了能够构建，请将 tsconfig.json 设置为项目中的内容。

【讨论】：

谢谢，我尚未验证这是否有效，但如果有效，我会将我接受的答案更改为这个答案。另外，您提供的链接非常有用。
将tsconfig.json 上的构建操作设置为Content 对我来说是缺少的一步。希望文档指出那部分！

【解决方案2】：

由于要使用MSBuild，可以编辑.csproj文件如下（我使用的是TypeScript 2.5）：

<Target Name="PostBuild" AfterTargets="PostBuildEvent">
  <Exec Command="&quot;C:\Program Files (x86)\Microsoft SDKs\TypeScript\2.5\tsc.exe&quot; -p tsconfig.json" />
</Target>

这并不理想，因为这是一个硬编码路径，所以我建议将C:\Program Files (x86)\Microsoft SDKs\TypeScript\2.5\ 添加到您的 Path 环境变量中。那么你可以使用更简洁的命令：Command="tsc.exe -p tsconfig.json"。

在项目的属性窗口中将命令输入到 post-build（或 pre-build，如果您正在寻找的话）会产生相同的结果。

【讨论】：

如果您使用 "$(TscToolPath)\$(TypeScriptEffectiveToolsVersion)\tsc.exe" -p tsconfig.json 代替，您不需要硬编码路径或更改您的 Path 环境变量。

【解决方案3】：

在这里看到两个好的答案之前，这是我尝试过的：

首先尝试添加我在谷歌搜索和查看“旧”csproj 文件时发现引用的 .csproj 的某些部分（在转换为新的 VS2017/.net 核心样式之前）

  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.Default.props" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.Default.props')" />

当我关闭解决方案并重新打开时，我收到了一个关于项目的 TypeScript 版本设置为 2.3 的问题，但 2.5 可用并且我是否想升级项目。我回答是的。现在我得到了 TypeScript 构建正确识别 tsconfig.json 文件的项目属性中的选项卡。

我希望构建时编译现在可以工作，但它没有。

我还补充了：

    <TypeScriptToolsVersion>2.5</TypeScriptToolsVersion>

到 .csproj 文件中的第一个 PropertyGroup。这也没有真正做任何事情。

然后尝试添加：

<ItemGroup>
  <TypeScriptCompile Include="src\sourcefile.ts" />
</ItemGroup>

使用 TypeScriptCompile 元素来编译所有文件。没有运气。

因为我已经在项目中设置了 Gulp（并且 MSBuild 实际上是从 Gulp 用于编译 typescript），所以我决定从 Gulp 调用的 MSBuild 切换到使用 NPM 模块“typescript”和“gulp-typescript”改为 Gulp 任务：

已移除：

gulp.task("Build", function () {
return gulp.src('./' + packageName + '.csproj')
    .pipe(msbuild(
        {
            stderr: true,
            stdout: true,
            toolsVersion: 15.0
        }));
});

添加：

var tsProject;
gulp.task("CompileTypeScript", ['NameOfAnotherTaskThatThisTaskDependsOn'], function () {
  var ts = require("gulp-typescript");

  if (!tsProject) {
      tsProject = ts.createProject("tsconfig.json");
  }

  var reporter = ts.reporter.fullReporter();
  var tsResult = tsProject.src()
    .pipe(tsProject(reporter));

  return tsResult.js
    .pipe(gulp.dest(""));
});

然后我在 Visual Studio 中将“CompileTypeScript”Gulp 任务绑定到 Before Build。工作正常，虽然我想知道这是否也可以使用新的 csproj 格式。

感谢@Balah 和@Joshit 的好建议，他们可能也工作得很好。

2018 年 2 月 8 日编辑：修正了一些拼写错误并更正了依赖 gulp 任务的名称（与任务同名，当然这不起作用）

欲了解更多信息，请参阅this article

【讨论】：

您可以接受它作为答案。这可能对阅读此主题的其他社区成员有所帮助

【解决方案4】：

如果您已经安装了 WebEssentials 插件，您会在工具 -> 选项下找到几个选项。我认为默认设置是保存时编译。但是您可以将此选项设置为 false 并将 Compile on build 设置为 true。

希望这就是你要找的。p>

【讨论】：