【进阶】移动端应用打包

版本说明

本文适用于 v5.6 版本,目前仅对安卓版本提供了初步支持,IOS 版本未测试。

前置条件:配置应用开启跨域

  • 请确保后端服务已经开启跨域支持,否则 APP 将无法正常访问后端服务

  • 跨域配置参考文档:服务配置 CORS 跨域

下载 PIGX 移动端应用并安装依赖

git clone https://git.pig4cloud.com/big/pigx-app.git
cd pigx-app
npm install --registry=https://registry.npmmirror.com
依赖安装

推荐使用国内镜像源加速依赖安装,如果安装失败可以尝试删除 node_modules 目录和 package-lock.json 文件后重新安装。

安装 HbuilderX 开发工具

  • 下载 HbuilderX 并安装

  • 导入 pigx-app 至 HbuilderX,并进行以下配置修改

HbuilderX 配置
配置修改

在 HbuilderX 中打开项目后,需要根据实际的后端服务地址修改配置文件中的 API 接口地址。

运行调试

设备连接

运行调试前,请确保通过 USB 连接安卓手机至电脑,并开启手机的 USB 调试模式。

  • 在 HbuilderX 中,选择 运行 > 运行到手机或模拟器 > 运行到 Android App 基座

  • 等待编译完成后,应用会自动安装到连接的安卓设备上

运行调试配置

特别说明 - 苹果 M 系列芯片运行

M 系列芯片

如果使用苹果 M1 芯片的电脑进行调试开发,需要进行以下特殊配置。

安装完依赖 npm install 后,找到 esbuild 目录中的 darwin-arm64,复制一份并重命名为 darwin-x64,否则将在后续调试中报错。

# 进入 esbuild 目录
cd node_modules/@esbuild

# 复制 darwin-arm64 并重命名为 darwin-x64
cp -r darwin-arm64 darwin-x64