最近在折腾一个大型TS项目，代码量上来了之后发现单次编译要等半天，热重载都快变成冷启动了。这体验实在忍不了，直到发现了TypeScript 3.0推出的项目引用（Project References）功能。这东西说白了就是让我们能把一个大项目拆成多个小项目，每个小项目可以独立编译，也可以被其他项目引用。最直观的感受就是编译速度嗖嗖地上来了，而且代码结构也清晰了不少。
- 为什么要用项目引用
以前我们处理monorepo或者模块化项目时，通常会用多个tsconfig.json文件，然后通过脚本控制编译顺序。这种方式不仅麻烦，而且很容易出错。项目引用直接把这种依赖关系做成了原生支持，解决了几个核心痛点：
增量构建：只重新编译修改过的部分
逻辑隔离：前端、后端、公共库可以拆分成独立单元
智能构建：TypeScript会自动分析依赖关系，按正确顺序编译
代码导航：IDE能准确跳转到依赖项目的源码而不是声明文件
- 项目结构设计
假设我们有个电商项目，典型结构可能是这样的：
改造后应该是：
- 具体配置步骤
根目录的tsconfig.json要这样配置：
子项目的配置示例（packages/core/tsconfig.json）：
- 构建命令的变化
原来直接用tsc编译整个项目，现在需要加上构建模式：
- 实际开发中的坑
第一个坑是循环依赖。项目A引用B，B又引用A，这种情况编译直接报错。解决方案是提取公共部分到第三个项目C。
第二个坑是路径别名。虽然配置了paths，但运行时还是要靠模块加载器解析。推荐用module-alias或者打包器别名功能配合使用。
第三个坑是声明文件生成。必须确保composite和declaration都开启，否则被引用的项目无法提供类型信息。
- 与传统方式的对比
之前用lerna+yarn workspace管理多包项目，虽然也能工作，但类型检查是隔离的。现在用项目引用，类型系统能跨项目流动，重构时特别爽。比如修改了core中的接口，所有引用的地方都会立即报错，不用等各自编译。
- 性能实测数据
在我当前项目（约10万行TS代码）中的测试结果：
全量构建：从45秒降到12秒
增量构建：平均3秒内完成
内存占用：降低约40%
IDE响应速度：提升明显
- 进阶技巧
对于特别大的项目，可以分层级引用。比如基础库层、业务模型层、应用层，每层内部可以并行构建。还可以利用prepend选项控制输出合并顺序，这对前端资源加载优化有帮助。
另外，项目引用可以和TypeScript的增量编译结合使用，实现双倍的速度加成。不过要注意磁盘空间消耗会更大，因为要存更多的缓存文件。
- 总结
项目引用不是银弹，但对于达到一定规模的前端项目来说，绝对是提升开发体验的利器。特别是现在微前端架构流行，多个团队协作开发时，用这个功能来管理类型依赖关系特别合适。刚开始配置可能觉得有点复杂，但一旦跑起来，就再也回不去了。