Monorepo 下的模块包设计实践

前言

本文主要面向前端 、Node.js 开发者，业务中使用 Monorepo 组织 应用 和 模块，抛砖引玉探讨下：

1. 怎样设计一个共享配置包（配置、类型、utils、枚举），同时在前端、Node.js、Vite 等项目中使用
2. UI 组件库怎么打包？组件库怎么支持服务端渲染（SSR）？有哪些好的最佳实践？
3. 怎么使用原生语言（Rust / C++ / Golang 等）编写的模块包？

为什么设计模块包？

随着 Monorepo 代码越堆越多、多人员协作情况下，不可避免遇到如下问题：

• 重复定义问题：工具方法、类型、配置在不同应用之间重复定义，维护困难。（例如：一个应用类型 AppType 的定义可以达 10 多处，很多还是旧的定义；项目用到配置； tsconfig.json 、prettier 等相同的配置写一遍又一遍）
• 依赖管理问题：为解决重用问题，我们也试过将模块先发成 npm 包，但发完需要更新应用 package.json 中的依赖版本，一来一回非常折腾。
• 跨项目使用问题：同构就是指 模块同时跑在前后端项目，兼容不同的模块包规范（CommonJS、ESM 等）。如果没有很好的设计包结构，经常会在项目编译打包时报错 ❌。

有哪些类型的模块包？

由于历史原因，JavaScript 模块化系统一直没有统一规范，大致发展过程是：CJS → AMD → CMD → UMD → ESM，这给设计一个跨应用使用的模块带来不少麻烦。