打包与发布流程

作者：陈川阅读数：44845人阅读分类： uni-app

打包与发布流程

uni-app 的打包与发布流程涉及多个环节，从代码编译到最终上架各平台应用商店。开发者需要根据不同目标平台调整配置，处理签名、证书等安全机制，并遵循各商店的审核规范。

开发环境准备

在开始打包前，确保开发环境配置正确。全局安装HBuilderX或配置CLI环境：

# 通过npm全局安装vue-cli
npm install -g @vue/cli

# 安装uni-app编译器
npm install -g @dcloudio/vue-cli-plugin-uni

项目本地需包含必要依赖：

{
  "dependencies": {
    "@dcloudio/uni-app": "^3.0.0",
    "@dcloudio/uni-ui": "^1.4.20"
  },
  "devDependencies": {
    "@dcloudio/types": "^3.0.0"
  }
}

通用打包配置

在项目根目录的manifest.json中配置基础信息：

{
  "name": "MyApp",
  "appid": "__UNI__XXXXXX",
  "versionName": "1.0.0",
  "versionCode": 100,
  "description": "应用描述",
  "icons": {
    "72": "./static/logo-72x72.png",
    "144": "./static/logo-144x144.png"
  }
}

微信小程序打包

在manifest.json中添加微信专属配置：

"mp-weixin": {
  "appid": "wx1234567890abcdef",
  "setting": {
    "urlCheck": false,
    "es6": true
  },
  "usingComponents": true
}

执行编译命令：

npm run dev:mp-weixin  # 开发环境
npm run build:mp-weixin # 生产环境

生成的dist/dev/mp-weixin目录需通过微信开发者工具导入，上传代码后提交审核。

Android App打包

证书生成

使用JDK的keytool生成签名证书：

keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystore

配置签名信息

在manifest.json中配置：

"android": {
  "packagename": "com.example.myapp",
  "keystore": "test.keystore",
  "aliasname": "testalias",
  "schemes": ["myapp"]
}

原生插件处理

如需使用原生插件，需在HBuilderX中配置本地插件或云端插件：

"plugins": {
  "myPlugin": {
    "version": "1.0.0",
    "provider": "插件ID"
  }
}

iOS App打包

证书准备

在Apple Developer创建App ID
生成Distribution证书和Provisioning Profile

Xcode工程配置

通过HBuilderX生成Xcode工程后：

修改Bundle Identifier为对应App ID
导入mobileprovision文件
配置自动签名或手动管理证书

特殊权限配置

在manifest.json中添加iOS权限声明：

"ios": {
  "UIRequiresFullScreen": true,
  "privacyDescription": {
    "NSPhotoLibraryUsageDescription": "需要相册权限"
  }
}

多平台差异处理

条件编译示例

处理平台差异代码：

// #ifdef MP-WEIXIN
wx.login({
  success(res) {
    console.log(res.code)
  }
})
// #endif

// #ifdef APP-PLUS
uni.login({
  provider: 'weixin',
  success(res) {
    console.log(res.authResult)
  }
})
// #endif

样式适配方案

使用uni-app的特定样式单位：

.header {
  /* rpx在微信小程序中自动转换 */
  height: 80rpx;
  /* upx在H5中会转换为rem */
  font-size: 32upx;
}

自动化构建

CI/CD集成示例

GitLab CI配置示例：

stages:
  - build

build_weixin:
  stage: build
  script:
    - npm install
    - npm run build:mp-weixin
  artifacts:
    paths:
      - dist/build/mp-weixin

版本号自动递增

通过脚本自动更新版本号：

const fs = require('fs')
const manifest = JSON.parse(fs.readFileSync('manifest.json'))
manifest.versionCode += 1
fs.writeFileSync('manifest.json', JSON.stringify(manifest, null, 2))

商店提交注意事项

应用截图规范

各平台要求不同：

iOS需要5.5寸和6.5寸截图
华为应用市场要求16:9的截图
小米要求至少3张横屏截图

隐私政策配置

在manifest.json中配置隐私政策链接：

"app-plus": {
  "privacy": {
    "prompt": "template",
    "template": {
      "title": "服务协议和隐私政策",
      "message": "请仔细阅读协议内容",
      "buttonAccept": "同意",
      "buttonRefuse": "拒绝"
    }
  }
}

热更新方案

wgt包更新流程

生成wgt包：

uni publish --platform app --project myproject

客户端检测更新：

uni.getUpdateManager().onCheckForUpdate(res => {
  if (res.hasUpdate) {
    uni.downloadFile({
      url: 'https://example.com/update.wgt',
      success: (downloadResult) => {
        uni.applyUpdate(downloadResult.tempFilePath)
      }
    })
  }
})

更新策略控制

通过接口控制更新范围：

// 检查版本更新
function checkUpdate() {
  uni.request({
    url: 'https://api.example.com/version',
    success(res) {
      if (res.data.forceUpdate) {
        showForceUpdateDialog(res.data.url)
      }
    }
  })
}