介绍

前后端分离团队成员分别擅长前端或者后端，因此分别负责开发业务模块的前端代码或者后端代码。那么，这时候我们就可以基于CabloyJS项目前后端分离的架构特点，进行分工合作

场景

假如我们有一个项目cabloy-demo，可以将业务所涉及的前端界面和后端逻辑拆分为两个业务模块，分别是demo-modulea和demo-moduleb，分别由成员A开发两个模块的前端，由成员B开发两个模块的后端，最后由成员C部署

成员 任务
成员A 开发两个模块的前端
成员B 开发两个模块的后端
成员C 部署

代码分割

1. 创建项目

  • 选项1：由任何成员创建一个项目骨架（项目名称为cabloy-demo），然后分发给其他成员

  • 选项2：成员独立创建项目骨架

  1. 1$ npm init cabloy cabloy-demo

2. 创建模块

  • 选项1：由任何成员创建一个业务模块的骨架，然后分发给其他成员

  • 选项2：成员独立创建业务模块骨架

  1. 1$ npm run cli :create:module demo-modulea -- --template=module-business --suite=

成果分享

1. 成员A与成员B

成员A与成员B之间不需要分享成果输出

2. 成员A与成员C

成员A需要把前端成果分享给成员C

在终端执行release:front命令，将demo-modulea和demo-moduleb前端代码编译打包，并将输出成果分享给成员C

  1. 1$ npm run release:front demo-modulea demo-moduleb

2. 成员B与成员C

成员B需要把后端成果分享给成员C

在终端执行release:backend命令，将demo-modulea和demo-moduleb后端代码编译打包，并将输出成果分享给成员C

  1. 1$ npm run release:backend demo-modulea demo-moduleb

代码调试

1. 成员A：前端调试

  • 选项1：可以在本地模块的后端代码中mock数据，并提供伪代码，从而配合前端代码的调试
  • 选项2：前端可以直接访问后端的开发服务，进行项目联调

比如，有如下场景：

成员 主机IP 前端/后端开发端口
成员A 192.168.1.101 9092
成员B 192.168.1.102 7002

那么，只需在成员A的项目前端进行如下配置即可：

{project}/build/config.js

  1. 1// front
  2. 2const front = {
  3. 3  dev: {
  4. 4    hostname: '192.168.1.101',
  5. 5    port: 9092,
  6. 6    proxyBaseURL: 'http://192.168.1.102:7002', // 后端开发服务
  7. 7  },
  8. 8};

2. 成员B：后端调试

  • 选项1：后端强烈建议基于测试驱动开发。测试驱动开发，可以有效沉淀开发成果，当代码出现变更时也能尽快锁定潜在问题，从而显著提升代码的鲁棒性
  • 选项2：后端可以直接访问前端页面，进行项目联调。如前所述场景，前端页面地址就是：http://192.168.1.101:9092

项目部署

成员A和成员B把各自的业务模块编译打包之后，分别分享给成员C，成员C进行常规的部署工作