PC源码客户开发调试

源码调试教程

开发环境

node

v 14.17.5

npm

v 6.14.14

全局依赖

# 安装全局依赖
npm install yalc lerna@^6.0.0 -g

JECloud私服地址

http://verdaccio.jecloud.net/

功能组件调试

功能组件的调试以基础库项目（jecloud-pc-libs）为主。下面以【请假申请HR_QJSQ】功能报错为例进行介绍

1. 下载基础库项目：jecloud-pc-libs

2. 安装依赖：

    npm run setup

3. 启动调试：

   添加.env.development.local文件并修改代理服务器地址

   

   执行启动命令

    npm run dev

4. 调试及核心代码介绍：

   

   项目中@jecloud/func核心代码

   

5. 若在调试中存在UI样式组件问题：

   项目中@jecloud/ui核心代码

   

6. 代码发布（本地调试）：

   npm run yalc:publish

7. 功能验证：

   一般情况下，在项目jecloud-pc-admin中验证即可～

   项目地址：jecloud-pc-admin

   下载依赖

    npm run setup

   启动命令

    npm run dev

8. 代码构建部署：

   在jecloud-pc-admin项目中执行 npm run build，在根目录下生成dist文件，将dist下的文件复制到服务器/data/application/openresty/nginx/jecloud文件下

   

微应用调试

以应用中心jecloud-pc-function为例

1. 下载项目：jecloud-pc-function

   如果只是简单的调试jecloud-pc-function应用中心的业务bug问题时，直接进入第4步；

   如果是调试jecloud-pc-function应用中心的UI样式问题，直接进入第3步；

   如果是骨架项目源码有所修改，那就按顺序执行；

2. 下载最新微应用骨架项目

   项目地址：jecloud-pc-archetype

   在jecloud-pc-function项目中关联骨架项目仓库地址：

   # 添加远程仓库
   git remote add cli http://xxx/xxx.git
   如：git remote add cli https://gitee.com/ketr/jecloud-pc-archetype
   
   # 查看是否添加成功
   git remote -v
   
   切换jecloud-pc-archetype本地骨架项目分支 template，更新仓库代码
   
   # 切换 cli 分支
   git checkout cli
   
   # 更新cli远程仓库的develop分支代码
   git pull cli develop
   
   // jecloud-pc-function合并到本地代码
   # 切换到本地代码
   git checkout develop
   
   # 合并代码，解决冲突
   git merge cli

3. 获取最新依赖

   将 jecloud-pc-libs执行命令 npm run yalc:publish

4. 安装依赖：

    npm run setup

5. 启动调试：

   项目根目录添加.env.development.local文件并修改代理服务器地址和websocket地址

   执行启动命令

    npm run dev

6. 调试及核心代码介绍：

   jecloud-pc-function核心代码位置

   

7. 打包：

   #打包命令
   npm run build

8. 部署：

   在服务器/data/application/openresty/nginx/jecloud/micro文件下找到function文件夹

   

   将输出文件dist下的文件复制到新增目录,

   • 注意：文件夹命名最好用项目名最后一个’-‘后面的文字进行命名，变为小写～

微应用插件如何和pc-jecloud-admin项目进行联调

1. 完成平台微应用管理及其菜单进行配置：

2. pc-jecloud-admin：
   a. 获取最新依赖
   将 jecloud-pc-libs执行命令 npm run yalc:publish
   b.在 jecloud-pc-admin
   1）执行npm run setup
   2）更改.env.development的配置信息（着重更改VUE_APP_SERVICE_PROXY， VUE_APP_WEBSOCKET_PROXY）
   3） 在src/stores/admin-store.js更改initMicroConfig方法
   

      // 相关代码
        initMicroConfig() {
             if (this.appConfig.size) {
               return Promise.resolve();
             } else {
               return loadMicroApp().then((data) => {
                 data.forEach((item) => {
                   // TODO:此处可以调试微应用，仅供开发使用
                   if (item.MICROAPP_CODE === 'JE_CORE_BOARDS_MODULES') {
                     item.MICROAPP_ENTRY = 'http://localhost:3002/micro/boards/';
                   }
                   const app = new MicroApp(item);
                   this.appConfig.set(app.name, app);
                 });
               });
             }
       },

   4）执行npm run dev:vuecli

3. 在微应用插件中：
   1）执行npm run setup
   2）执行npm run dev:vuecli