Typescript + webpack（带热重载）+ NodeJS

Posted 2023-02-22

【中文标题】Typescript + webpack（带热重载）+ NodeJS

【英文标题】：Typescript + webpack (with hot reload) + NodeJS

【发布时间】：2016-05-13 07:44:37

【问题描述】：

面临问题 - 设置一些基于 TypeScript 的项目原型。它包含客户端脚本和服务器部分（NodeJs 和 ExpressJs）。

我希望将 webpack 作为打包器并使用热重载功能实时查看更改。最初，我使用react-transform-boilerplate-ts，但那里的问题 - 开发服务器的入口点是 js 文件。我想它应该是 ts，因为我想包括我的 express 配置等。

那么，有没有人有好的样板（遵循项目结构中的最佳实践）来创建包含以下内容的项目：

客户端（React）和服务器（打字稿） 后端使用 NodeJs 和 ExpressJs（打字稿） 客户端和服务器支持热重载（据我了解最好的选择 - 是用于重载的 webpack 选项，而不是运行监视的 gulp 任务）。

或者你可以给我一些好的建议，如何以正确的方式配置那种东西。

非常感谢

【参考方案1】：

有没有人有好的样板（遵循项目结构中的最佳实践）来创建项目

这是我开源的一个项目：https://github.com/alm-tools/alm

客户端（React）和服务器（打字稿）

检查！

后端使用 NodeJs 和 ExpressJs（打字稿）

检查！

客户端和服务器支持热重载

检查！ : 这里是贡献文档https://github.com/alm-tools/alm/blob/master/docs/contributing/README.md#webpack?

【讨论】：

虽然您的项目确实符合组成标准，但我不明白您如何将其视为“样板”。这是一个使用 OP 正在寻找的技术堆栈的成熟应用程序。我正在寻找与 OP 类似的东西，但从您的项目中提取样板文件将是一项艰巨的任务。

【参考方案2】：

我最近发布了我的项目管理应用程序的代码（nodejs / reactjs + redux / 服务器渲染等） - https://github.com/Brainfock/Brainfock 看看（提供在线演示），希望你能找到有用的东西：

也就是说，请参阅 webpack 配置以获得一个很好的例子来解决您的问题：https://github.com/Brainfock/Brainfock/tree/master/webpack （我认为不需要从 Github 复制粘贴代码）

【讨论】：

感谢您的关注，但是，我相信 Github 页面不会去任何地方，在这里复制粘贴整个源文件可能是更糟糕的主意。我专门为作者留下了一个链接，以确切了解他的要求