自动编译TypeScript源并复制静态（模板）文件

Question

调试快递服务器时，我的“构建和运行”过程包括3个步骤：

• 使用tsc
编译TypeScript源代码
• 将图像和模板之类的静态文件复制到dist/
• 运行已编译的server.js文件

这些步骤中的每个步骤都可以使用监视模式自动执行，但是我很难将这三个步骤结合在一起。 我通过使用tsc-watch来观看TypeScript源代码，cpx来复制静态文件，最后使用nodemon来重新启动服务器来使其工作。 这种方法可行，但存在两个问题：

• cpx仅监视启动时存在的文件（我认为tsc-watch有时也会这样做 ，这有点奇怪）
• 此方法需要在3个单独的终端中使用3条命令，这很不方便
• cpx和tsc-watch都无法正确处理Ctrl+C退出，从而导致各种问题

我found some other questions与此主题相关，但他们都没有解决上述问题（尽管他们确实告诉了我关于cpx和tsc-watch的信息）。 我不想使用concurrently，因为它可能会导致计时问题，并且会混合来自不同进程（最著名的tsc-watch和实际服务器）的控制台输出。

仅使用tsc-watch的{​​{1}}复制静态文件是不够的，因为模板文件中的更改不会被提取。可以通过更改源文件中的注释来解决此问题，但这会触发完全重新编译（重新启动服务器）。 使用webpack's watch mode还是不够的，因为它不会拾取新文件，甚至会污染控制台输出。

有没有我可能错过的解决方案？我是否应该编写一个脚本自动打开三个必需的终端？

Answer 1

我最终选择了webpack和copy-webpack-plugin。

不幸的是，尽管在撰写本文时手表模式为broken，但似乎完全符合我的需求几乎：

• 此方法仅需要2个终端（一个用于webpack，另一个用于nodemon）。它不是完美的，但是比3好很多。
• 应该自动拾取新文件 （尽管当前无法100％正常运行）
• 静态文件中的更改不应导致完整的重新编译，这将导致服务器重新启动（同样，当前不能100％正确地工作）
• Webpack处理Ctrl+C正常退出
• 对我来说，最重要的原因是：copy-webpack-plugin使我可以指定如何使用context选项更详细地复制文件