使用Yarn Workspaces搭建monorepo的正确构建与运行流程是怎样的？

前置配置确认 #

首先保证你的项目配置符合workspaces规范：

• 根目录package.json正确声明workspaces字段，覆盖所有公共模块、应用的存放路径，示例：

{
  "workspaces": [
    "common",
    "server",
    "web"
  ]
}

• common模块的package.json声明正确的包名（比如@your-project/common），main/module字段指向构建后的产物入口
• server、web的package.json的dependencies中明确声明对@your-project/common的依赖，版本和common模块的版本保持一致

标准构建运行步骤 #

1. 根目录执行yarn install，完成全量依赖安装和内部模块的软链
2. 构建公共模块：执行yarn workspace @your-project/common build，产出common的可运行产物
3. 分别构建各个应用：
   • 构建server：yarn workspace server build
   • 构建web：yarn workspace web build

解决部署包体积过大的核心操作 #

不要直接复制根目录全量node_modules，针对每个应用单独安装生产依赖：

• 对于Node类型的server应用：
  • 将server目录下自己的package.json复制到server的构建产物目录中
  • 在该构建产物目录下执行yarn install --production --no-workspaces，该命令会忽略monorepo的workspaces规则，仅安装当前package.json声明的生产依赖，不会引入web端的Material UI等冗余包，依赖的common模块也会自动从本地workspace拉取对应产物
• 对于纯前端React应用：
  • 常规CSR项目构建后的产物已经打包了所有业务依赖，直接部署dist目录即可，完全不需要携带node_modules
  • 如果是SSR类前端应用，参考server应用的处理方式单独安装生产依赖即可

可选优化方案 #

• Yarn 2+ 可以直接使用yarn workspaces focus <workspace名称> --production命令，在根目录即可完成单个应用的生产依赖安装，不用进入子目录操作
• 使用Docker部署的场景可以用多阶段构建，构建阶段全量安装依赖完成编译，最终运行镜像仅拷贝对应应用的构建产物和单独安装的生产依赖，镜像体积可以压缩到几十MB级别

内容的提问来源于stack exchange，提问作者Pavel