Flutter的ios与android打包---完整踩坑路径

1. 修改基础信息

基础信息修改可以先不改,后面再改都行

1.1. 修改APP名称

1.1.1. android

1.1.2. ios

注意:不建议修改包名(非app名称),包名最好在项目创建时就写好,后期修改地方比较多

1.2. 修改版本号

pubspec.yaml

yml 复制代码
version: 0.0.1+1

2. Android打包

2.1. 配置权限

android/app/src/main/AndroidManifest.xml

权限配置看个人需要是否更改

xml 复制代码
    </application>
<!-- 网络权限 -->
  <uses-permission android:name="android.permission.INTERNET" />
</manifest>

2.2. 设置 sdk 版本

可改可不改

android/app/build.gradle

  • 以下版本号作为参考,可以不做更改
json 复制代码
defaultConfig {
  minSdkVersion 19
  compileSdkVersion 33
  targetSdkVersion 33
}

2.3. 签名证书配置

  • /Users/ch.w/Desktop/code/planx_app/android,这个是生成证书的路径,我直接写到项目路径下了
shell 复制代码
keytool -genkey -v -keystore /Users/ch.w/Desktop/code/planx_app/android -keyalg RSA -keysize 2048 -validity 10000 -alias key
  • 输入密码等,完成创建
  • 同样在android下新建keystore.properties 文件

android/keystore.properties

ini 复制代码
storePassword=654321
keyPassword=654321
keyAlias=key
storeFile=../key.jks
  • 添加到build.gradle配置中

android/app/build.gradle

dart 复制代码
def keystorePropertiesFile = rootProject.file("key.properties")
def keystoreProperties = new Properties()
keystoreProperties.load(new FileInputStream(keystorePropertiesFile))

android {
    //......
    signingConfigs {
        release {
            keyAlias keystoreProperties['keyAlias']
            keyPassword keystoreProperties['keyPassword']
            storeFile file(keystoreProperties['storeFile'])
            storePassword keystoreProperties['storePassword']
        }
    }

    buildTypes {
         release {
            signingConfig signingConfigs.release
            // 启用缩减、混淆处理和优化功能,
            minifyEnabled true
            shrinkResources true
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
        debug{
            // debuge模式也使用证书
            signingConfig signingConfigs.release
            ndk {
                abiFilters 'arm64-v8a', 'armeabi-v7a', 'x86', 'x86_64'
            }
        }
    }
}

2.4. 打包

shell 复制代码
 flutter build apk

报错解决:

  • 该报错不影响打包,可以不做更改
  • 修改android/build.gradle 中的版本号
json 复制代码
buildscript {
    ext.kotlin_version = '1.8.22'
    // ....
    dependencies {
        classpath 'com.android.tools.build:gradle:8.0.0'
        //....
    }
}
  • 修改gradle的版本号

android/gradle/wrapper/gradle-wrapper.properties

arduino 复制代码
// ....
distributionUrl=https://services.gradle.org/distributions/gradle-8.0-all.zip

3. IOS打包

前提:

  • 拥有ios开发者账号
  • 使用mac电脑,需要用到xcode

3.1. Xcode可视化打包

  • 找到Runner.xcworkspace,双击打开
  • 建议先使用xcode打包,始终允许打包,并且生成ExportOptions.plist,命令行打包时候会用到

3.1.1. 自动生成证书

选择开发账号,自动生成证书

3.1.2. 新建App ID

开发者后台,新建appid

3.1.3. 在appStore后台新建app

  • 这一步非必需,不过后期如果要上传到app store,建议先新建,避免app名称后面被占用了

3.1.4. 打包

  • 此时可能有报错:
  • 解决方案:

到项目ios目录下,执行pod install

此时会弹出输入电脑开机密码的弹窗,输入密码后,选择总是允许

继续以下步骤:

报错: An SSL error has occurred and a secure connection to the server cannot be made.

解决方案:

  • 点击取消,再次选择distribute app重新打包

导出

查看导出的文件夹

  • 记住这个ExportOptions.plist,后续使用命令行打包时,我们直接引入这个问价就行
  • 这里我们打包的是adhoc,上传到分发平台,就可以测试了。
  • 这里我用的分发平台是:www.betaqr.com.cn/apps

3.1.5. 选择打包appstore,制作appstore的ExportOptions.plist

3.2. 命令行打包

  • 将上面步骤的ExportOptions.plist复制到项目中,并改名为:adhoc.plist(为了区分App Store包的plist文件)

使用命令:

adhoc

  • /Users/ch.w/Desktop/code/planx_app是我本地项目的地址
css 复制代码
flutter build ipa --release --export-options-plist=/Users/ch.w/Desktop/code/planx_app/ios/adhoc.plist

appstore

css 复制代码
flutter build ipa --release --export-options-plist=/Users/ch.w/Desktop/code/planx_app/ios/appStore.plist

打包成功:

4. 编写脚本完成自动打包

参考:flutter快速上手 - 掘金,中的打包篇章

这里就不细写了。

相关推荐
灵感__idea5 分钟前
Hello 算法:让前端人真正理解算法
前端·javascript·算法
向葭奔赴♡40 分钟前
CSS是什么?—— 网页的“化妆师”
前端·css
黑犬mo44 分钟前
在Edge、Chrome浏览器上安装uBlock Origin插件
前端·edge
excel1 小时前
🧩 Vue 3 watch 源码详解(含完整注释)
前端·javascript·vue.js
大前端helloworld1 小时前
前端梳理体系从常问问题去完善-网络篇
前端·面试
excel1 小时前
🌿 一文看懂 Vue 3 的 watch 源码:从原理到流程
前端
繁依Fanyi2 小时前
让工具说话:我在 Inspira Board 里用 AI 把“能用、好用、可复用”落成了日常
前端
weixin_456904273 小时前
C# 中的回调函数
java·前端·c#
kura_tsuki3 小时前
[Web网页] LAMP 架构与环境搭建
前端·架构
yinuo3 小时前
UniApp+Vue3多分包引入同一 npm 库被重复打包至 vendor 的问题分析与解决
前端