# 代码调试(四)：两种构建模式的区别

在 ArenaPro 中，你有两种主要的方式来编译和更新你的代码：**HMR (热更新)** 和 **完整构建 (`Alt+Q`)**。

你可能想问：它们有什么不同？我应该在什么时候用哪一个？

这篇指南会用一个简单的比喻来解释清楚。

## 餐厅厨房的比喻

想象你是一家餐厅的主厨：

- **HMR (热更新)** 就像你在 **调试菜品**。你正在熬制一锅汤，觉得味道有点淡，于是你加了一小撮盐，然后立刻尝一下。你不需要把整锅汤倒掉重做，只是在现有基础上进行微调。这个过程**快速、即时**，专为开发和调试而生。

- **完整构建 (`Alt+Q`)** 就像餐厅 **正式开业前的总准备**。你需要把菜单上的每一道菜都从头到尾、一丝不苟地做一遍，确保流程、配料和最终成品都完美无缺。这个过程**缓慢、彻底**，是为了交付最终、最优化的产品。

## 核心区别

| 特性         | HMR (热更新)                                   | 完整构建 (`Alt+Q`)                             |
| :----------- | :--------------------------------------------- | :--------------------------------------------- |
| **使用场景** | **日常开发、调试**                             | **发布项目、最终测试**                         |
| **速度**     | 极快，只编译你修改的部分 (增量更新)            | 较慢，编译所有文件 (全量更新)                  |
| **工作方式** | 在后台“监视”文件，保存即自动更新到游戏中       | 手动触发，将整个项目打包成最优化的代码         |
| **核心优势** | **效率**：让你沉浸在编码中，无需分心于构建过程 | **性能**：确保发布的游戏代码体积最小、运行最快 |

## 它们是如何工作的？

### HMR 的工作流：只更新变化点

当你启动 HMR 并修改一个文件时，它会精准地找到这个“变化点”，只重新编译这一个模块，然后像打补丁一样把它注入到正在运行的游戏里。

### 完整构建的工作流：一切从头开始

当你按下 `Alt+Q`，它会执行一个完整的两步流程：

1.  **TypeScript 编译 (TSC)**：首先，把你所有的 `.ts` 源码文件一个个翻译成浏览器能读懂的 `.js` 文件。
2.  **Webpack 打包**：然后，Webpack 会接手这些 `.js` 文件，分析它们之间的依赖关系，把它们智能地打包、压缩成最终的、高度优化的游戏代码。

## 结论：我该用哪个？

答案很简单：**两个都要用，但在不同阶段使用。**

- **在 99% 的开发时间里，你应该使用 HMR**。它能提供最流畅、最高效的“编码-查看”循环。
- **当你准备把作品发布给其他人玩时，执行一次“完整构建”**。这能确保你的玩家获得最佳的性能体验。

理解这些底层差异，能帮助你更深刻地认识 ArenaPro 的构建流程，并在遇到问题时，能更准确地定位和解决。
