APP打包部署

苏州迈沃通信有限公司

TIP

工具下载:

Android Studioopen in new window

jdk 17open in new window

Flutter 3.24.3open in new window

gitopen in new window

[Xcode]需要MacOS,直接在App Store下载

以上工具不要安装到中文路径

一 开发工具安装

1. 下载Android Studio并默认安装

  • 打开上面链接选择对应操作系统下载最新版并安装。 img_22.png

2. 下载jdk 17并默认安装

  • 打开上面链接选择对应操作系统下载jdk17并安装。 img_23.png

3. 下载Flutter并解压

  • 一定要下载3.24.3版本,其他版本运行可能报错,请自行兼容,下载完成后解压备用 img_24.png

4. 下载git并默认安装(如果已安装可忽略)

  • 全部默认安装即可 img_25.png

5. 配置环境变量(如果已配置可忽略)

  • Windows下打开系统属性窗口:右键点击 “此电脑”,选择 “属性”。在弹出的窗口中,点击 “高级系统设置”。
  • 打开环境变量窗口:在 “系统属性” 窗口中,点击 “环境变量” 按钮。
  • 配置系统变量:
  • 在 “系统变量” 区域中,找到 “Path” 变量,选中它并点击 “编辑” 按钮。
  • 在 “编辑环境变量” 窗口中,点击 “新建” 按钮。
  • 配置jdk环境变量,添加两条C:\Program Files\java 17\binC:\Program Files\java 17\lib
  • 配置git环境变量,添加C:\Program Files\Git\bin
  • 配置flutter环境变量,添加E:\flutter\bin
  • 以上目录如安装到其他地方,请自行修改
  • img.png
  • macos请自行百度

6. 配置flutter

  • 参照上面添加到系统环境变量,和Path同一层,不是加到Path里面
  PUB_HOSTED_URL=https://pub.flutter-io.cn
  FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

7. 安装Xcode(打包iOS必须)

  • 需要苹果系统macOS 15,打开App Store搜索Xcode安装 img_46.png

二 开发环境配置

1. 解压项目文件

解压tsq-app.zip,如果提供的git链接,忽略这步,需要解压后放到全英文路径下,比如e:\workspace\tsq-app

2. 使用Android Studio打开tsq-app

  • 双击打开Android Studio
  • 使用git下载项目或者直接打开项目
  • 如果给的是git仓库链接,直接选择Get from Version Control...
  • 如果给的是压缩包,直接Open上一步解压缩的目录 img_26.png

3. 安装Flutter和Dart插件

  • 进入Android Studio的设置,windows和mac会有细微差别 img_27.png
  • 进入插件市场,安装FlutterDart,安装完成后可能需要重启 img_28.pngimg_29.png

4. 配置Flutter

  • 进入Android Studio的设置,windows和mac会有细微差别 img_27.png
  • 设置flutter3.24.3的解压目录,如E:\flutter,点击OK保存 img_30.png

5. 配置Android sdk

  • 进入Android Studio的设置,windows和mac会有细微差别 img_27.png
  • 设置sdk路径后,会自动下载 img_31.png

6. 校验flutter环境

  • 进入Android Studio命令行执行flutter doctor,如果显示红叉的按照提示解决 img_32.pngimg_35.png

7. 下载依赖

  • 打开根目录下的pubspec.yaml,点击右上角的Pub get,第一次下载可能需要几个小时,只要不报错,就继续等待 img_34.png

三 APP配置修改

1. 进入Android Studio的设置,windows和mac会有细微差别

img_27.png

2. 快捷键改成Eclipse,点击OK保存

img_36.png

3. 修改包名和APP名称

  • 按快捷键Ctrl+H全局搜索com.mailvor.app.shopping,把所有搜索到的结果全部改成自己包名 img_37.png

  • 按快捷键Ctrl+H全局搜索淘省钱,把所有搜索到的结果全部自己APP名称 img_69.png

4. 修改MainActivity路径

  • 比如自己的包名为com.mai.app,在com下新建mai,再新建app, 一定要分开新建,不能直接新建mai.app,新建完成后,把MainActivity移动到app目录下 img_38.png

5. 替换安卓证书

  • 修改成自己的证书 img_39.png

6. 修改安卓证书别名密码信息

img_40.png

7. 修改API域名、隐私政策、微信开放平台等配置

  • 图中配置全部改成自己的 img_41.png

8. 修改百川安全图

  • 安全图获取请查看淘宝联盟官方文档,需要最新的6.1版本,替换成自己的,文件名不能改变
  • iOS img_42.png
  • Android img_44.png

9. 修改淘宝开放平台AppKey

  • iOS安全图生效还需要修改ios配置,打开ios/Runner/Info.plist,找到tbope开头,把后面的数字改成自己的淘宝开放平台应用的AppKey img_45.png

10. 替换APP图标

展开目录android/app/src/main/res,找到sy_logo.png splash.png ic_launcher.png,替换成自己的,分辨率要匹配 img_70.png

展开目录ios/Runner/Assets.xcassets,找到sufenbaoXX.png LaunchImageXX.png logo_shanyan_textXX.png,,替换成自己的,分辨率要匹配 img_71.png

展开目录aeests/images,找到logo.png logo1024.png splash.png,,替换成自己的,分辨率要匹配 img_72.png

四 打包

1. 打包Android App

  • 打开Android Studio

  • 打开命令行执行以下命令flutter build apk或者按照下图按钮打包 img_47.png

  • 打开build/app/outputs/flutter-apk得到app-release.apk文件,可以直接上传应用市场

  • img_48.png

2. 打包iOS App

  • 打开Android Studio

  • 打开命令行

  • 进入ios目录 cd ios,如果已经在ios目录下无需执行

  • 执行pod installimg_55.png

  • 打开Xcode,选择Open Existing Project...,选择项目根目录下的ios目录 img_50.png

  • 修改团队信息 img_54.png

  • 选择Product->Archive进行打包 img_51.png

  • 上传安装包到App Store,等待完成即可 img_52.pngimg_53.png