Skip to content

Build App(打包应用)

本文档是旧的壳工程模式。新版本已经不在使用!!!

如果你的项目想要升级为完整模式。请找架构组

提示

已知使用此框架项目有

  • 如是心
  • 垦道(源码已移交)

打包Andorid App 与 IOS App

本文档将详细描述如何在taro-native-shell中打包Android App 与 IOS App

APP的打包简单分为两步:

Build Bundle

本框架采用的是分离模式。所以当你需要打包App的时候。你需要首先在壳工程外面的项目中先打包Bundle。相关命令会将APP用到的Bunlde资源分发到shell中对应的位置。然后再通过壳工程或者开发者工具进行原生应用的打包。

相关配置在根目录的config文件夹下的index.js文件中。相关配置如下

js
  // ...其他配置
  rn: {
    appName: 'taroDemo',
    output: {
      iosSourceMapUrl: '', // sourcemap 文件url
      iosSourcemapOutput: resolve('../taro-native-shell/ios/main-ios.map'), // sourcemap 文件输出路径
      iosSourcemapSourcesRoot: '', // 将 sourcemap 资源路径转为相对路径时的根目录
      androidSourceMapUrl: '',
      androidSourcemapOutput: resolve('../taro-native-shell/android/app/src/main/assets/index.android.map'),
      androidSourcemapSourcesRoot: '',
      ios: resolve('../taro-native-shell/ios/main-ios.jsbundle'),
      iosAssetsDest: resolve('../taro-native-shell/ios'),
      android: resolve('../taro-native-shell/android/app/src/main/assets/index.android.bundle'),
      androidAssetsDest: resolve('../taro-native-shell/android/app/src/main/res')
    }
  }

打包Bundle的命令如下

bash
npm run build:android // 打包Android Bundle
npm run build:ios // 打包IOS Bundle

npm run uat:android // 打包Android Bundle UAT环境
npm run uat:ios // 打包IOS Bundle UAT环境

当命令执行完毕之后。进行下一步打包App

Build APP

IOS

请务必看完 taro 文档 相关的内容

IOS需要通过XCode进行打包

注意 你需要手动在XCode中加入Bundle资源的引用

  1. 打开XCode。选中项目

  2. (可选) 清理bundle资源。 如果你的项目中已经存在assetsmain-ios.jsbunldemain-ios.map。请手动删除引用 3

  3. 打开taro-native-shell/ios文件夹。将assetsmain-ios.jsbunldemain-ios.map手动拖拽至XCode项目中。选择设置为引用 1

  4. 执行 Product-Archive进行构建.
    1ps: 如果你的选项是灰色的。你需要把构建选择为Any IOS Device

  5. Archive完成之后。会出现发布页面。你可以进行部署测试了 1ps: 在Archive过程中会弹出一个终端窗口。不用管他。关闭就好了(这是个bug...暂时没空处理)

  6. 后续的处理按照IOS正常发布即可

IOS Build 解析

bash
  // 1.在项目根目录下执行 
  yarn build:ios
  # 命令执行后。会在taro-native-shell/ios 中输出一些bundle文件
  # ios/assets/*
  # ios/main-ios.jsbundle*
  # ios/main-ios.map
  
  // 2.用Xcode打开ios工程 打包

Android

请务必看完 taro 文档 与签名相关的内容

有两种方式打包Android App

  1. 命令构建
    taro-native-shell目录下执行npm run build:android命令. 命令运行完毕后会在android/app/build/outputs/apk目录下生成apk文件。然后将apk文件安装到手机上即可。

  2. 使用Android Studio进行构建
    安装Android Studio。然后打开android目录下的项目。然后在Android Studio中进行打包。

安卓Build解析

bash
  // 1.在项目根目录下执行 
  yarn build:android
  
  // 命令执行后。会在taro-native-shell/android 中输出一些bundle文件
  // android/app/src/main/assets/index.android*
  // android/app/src/main/res/drawable-*/*.png
  // android/app/src/main/res/raw/*.ttf
  

  
  // 2.进入壳工程 打包安卓包 
  npm run build:android 
  #  相当于
  # cd taro-native-shell/android
  # ./gradlew clean  // (非必须)
  # ./gradlew assembleRelease
  
  // 2.1或者你也可以用androidStudio 打包

  // 3.构建完成之后会输出文件
  taro-native-shell/android/app/build/outputs/apk/release/app-release.apk

  // 4.安卓安装包 (或者手动装)
  adb install  path/to/app-release.apk