我对什么可以为我编译 TypeScript 文件以及何时编译感到困惑：
TypeScript 文件应该放在哪里：
..\app\*.ts..\wwwroot\app\*.ts如何让 TypeScript 编译超快，并在浏览器中立即生效自动更新或自动部署？
在像 TeamCity 这样的构建服务器上会发生什么？
PS：同样适用于 LESS？
【问题讨论】：
标签： visual-studio typescript gulp asp.net-core web-essentials
在我的宠物项目中，我使用 gulp 来构建 .less 和 .ts 文件。它是这样工作的：
gulp.task('processTypeScript', function () {
gulp.src('Content/TypeScript/**/*.ts')
.pipe(sourcemaps.init())
.pipe(ts(tsOptions)).js
.pipe(sourcemaps.write())
.pipe(gulp.dest('./wwwroot/content/script'));
});
gulp.task('build', ['copyLibs', 'processTypeScript', 'processLess']);
第一个任务通过添加源映射构建 typescript 文件并将结果复制到wwwroot 文件夹，第二个任务是完全构建所有客户端代码 - 我不描述所有这些任务，它们是相同的。
为了方便开发，我使用watch 机制，所以很简单：
gulp.task('watch', ['processTypeScript', 'processLess'], function () {
gulp.watch('Content/TypeScript/**/*.ts', ['processTypeScript']);
gulp.watch('Content/Less/**/*.less', ['processLess']);
});
现在打字稿文件将根据其中的任何更改重新编译。
为了向 html 添加文件，我使用这种方法
<environment names="Development">
<script asp-src-include="~/content/script/**/*.js" asp-append-version="true"></script>
<link rel="stylesheet" asp-href-include="~/content/style/**/*.css" asp-append-version="true" />
</environment>
注意asp-append-version — 这会阻止浏览器中的缓存。
最后，您可以通过 gulp 构建最小化的 uglified 脚本和样式文件以进行生产配置，并将其包含在页面上的 <environment names="Production"> 标记中。
所以，这对我来说很舒服。我在项目打开时添加了build 和watch 任务，不关心编译脚本和样式。
【讨论】：
Visual Studio 通常在保存 ts 文件时可以将项目中的.ts 编译成.js。
你可以在这两个地方放置 TypeScript。
如果选择..\app\*.ts，需要用gulp帮你把js放到wwwroot里面。
您可能需要 gule 来观看开发中的 ts 文件，以便它可以自动更新。
如果选择..\wwwroot\app\*.ts，js可以在浏览器中自动更新。但用户也可以根据需要获取您的 ts 文件。
TeamCity 可能无法编译 ts，除非您明确使用 tsc 编译它。
【讨论】：
目前我的理解是 VisualStudio 模板在 xproj 中没有后期构建指令来进行打字稿的编译。虽然这可能会在工具退出预览时发生变化。
在我当前的设置中，我依靠 npm typescript 包和一个 gulp 任务来为我的 typescript 项目创建 .js 输出和源映射。
我的 wwwroot/app
下有一个文件夹，其中包含我所有的打字稿源- wwwroot
- app
- typings
- globals
index.d.ts
app.ts
tsconfig.json
tslint.json
我的gulp 用于构建 javascript 和源映射的任务：
gulp.task('build:ts', false, function () {
var tsProject = $.typescript.createProject(app + 'tsconfig.json', { sortOutput: true });
var stream = tsProject.src();
return stream.pipe($.sourcemaps.init())
.pipe($.typescript(tsProject))
.pipe($.sourcemaps.write('.', { includeContent: false, sourceRoot: '' }))
.pipe(gulp.dest(app));
});
最后但并非最不重要的是，我使用类型来获取打字稿定义。
如果您有一个完整的前端故事来构建脚本（不包括在内）。然后构建服务器可以恢复你的 npm 开发依赖并运行你的 gulp 任务来构建你的前端代码就好了。这同样适用于 Visualstuio 在线构建任务。
【讨论】：
tsc 调用。
wwwroot。 typescriptlang.org/docs/handbook/asp-net-core.html
*.ts 文件&TeamCity 会尊重这一点。这可以在 publishOptions 设置下的 project.json 文件上完成。 "exclude": ["*.ts"]
这也让我有点困惑。
使用 .net 核心，无论我是从 IDE 构建还是使用 dotnet build 从命令行构建，我都无需单独执行任何操作来编译类型脚本。
tsconfig.json 文件似乎决定了 typescript 的构建。
JS 和 MAP 文件创建在与 TS 文件相同的文件夹中，这样可以保持一切都很干净。
我已经上传了所有这些工作。见：https://github.com/MikeyFriedChicken/DotNetCoreTypeScript
非常感谢
迈克尔
【讨论】：