跨端三剑客

近几年来，随着挪动端开发的需要的一直变大，跨端框架也在一直的蓬勃发展，随之工夫的推移，有三个跨端框架凭借其各自的劣势，呈现在大家的眼前 Uniapp、Flutter、React Native。

其中 uni-app 在开发者数量、案例、跨端抹平度、扩大灵活性、性能体验、周边生态、学习老本、开发成本等要害指标上领有更强的劣势.

这里盘点下曾经反对小程序的超级 App：

微信、企业微信、QQ、支付宝、高德地图、手机淘宝、百度、百度贴吧、百度地图、今日头条、抖音……

前置常识

软件方面：这里举荐所有 uniapp 的跨端开发都应用 HBuilderX 进行开发，这里举荐不是因为 webstorm、vscode 怎么样不好，而是因为 HBuilderX 对 uniapp 的语法及 vue 相干的提醒更为的不便，且更轻量。

常识筹备：相熟 vue 的相干语法。理解小程序的路由的配置办法。相熟各自的生命周期等常识。这对于跨端开发的常识筹备几乎不能再简略。

APP 开发过程中注意事项

理解编译条件

写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 结尾，以 #endif 结尾。

ifdef：if defined 仅在某平台存在

ifndef：if not defined 除了某平台均存在

%PLATFORM%：平台名称

示例，如下代码仅在 App 下呈现:

相熟相干性能的配置(manifest.json)
(1).APP 图标配置

倡议应用 1024X1024 的图片，而后进行一键生成所有尺寸的图标。

根底配置
根底配置尽管读起来很根底，但却是 APP 的重要信息配置包含 APP 的名称、利用版本名称、版本号。这里的版本名称在咱们进行版本升级时肯定是要递增的，这里版本名称在 IOS 打测试版本时能够只减少版本号的数字

启动页
App 启动时，因为利用主动须要肯定工夫，为了防止用户期待白屏，手机 OS 提供了非凡的启动界面设计，让用户先看到一个简略的界面，而后该界面隐没，正式进入利用。

这个界面，即被称为启动界面，也成称为 splash 或 lauch screen。

启动界面本来是一个动态 png 图片形式。随着挪动设施屏幕的多样化，为了让每种屏幕启动时界面都不变形，开发者须要为越来越多的屏幕尺寸制作不同的图片。

这带来很多问题，包含制作简单、app 包体积增大等。

于是 Android 创造了.9.png 形式、iOS 创造了 storyboard 形式，来解决多屏幕尺寸适配问题。

苹果公司的政策更为强硬，从 2020 年 6 月 30 日起，不再承受应用图片作为启动界面，必须应用 storyboard，否则无奈提交 Appstore。

DCloud 的 App，反对所有 Android 和 iOS 的启动界面形式。

APP 模块配置
这里次要配置 APP 中须要调用的地图、领取、推送、视频的性能配置。如 key、appid 等之类的填写须要各位到对应平台进行生成配置；

插件、其它配置
插件配置及其它配置没有非凡需要能够应用默认配置；不用进行变更；

APP 打包
uniapp 的打包操作其实非常傻瓜式；个别咱们在开发的工程中须要挪动端调试会打一个自定义基座，以便开发的调试等工作，惟一须要解决的就是证书文件的获取形式; 上面就安卓和 IOS 的配置文件获取予以介绍;

安卓:

咱们须要一个安卓证书，咱们来生成一下安卓证书,Android 平台打包公布 apk 利用，须要应用数字证书（.keystore 文件）进行签名，用于表明开发者身份。

Android 证书的生成是自助和收费的，不须要审批或付费。

能够应用 JRE 环境中的 keytool 命令生成。以下是 windows 平台生成证书的办法：

装置 JRE 环境（举荐应用 JRE8 环境，如已有可跳过）
可从 Oracle 官网下载 jre 安装包：https://www.oracle.com/techne…
上面以 Windows 平台，jre 装置目录为“C:\Program Files\Java\jre1.8.0_201”为例，实际操作时请批改为本人装置目录
倡议将 JRE 装置门路增加到零碎环境变量，已配置可跳过此章节
关上命令行（cmd），输出以下命令：

复制代码 d: set PATH=%PATH%;”C:\Program Files\Java\jre1.8.0_201\bin”

第一行：切换工作目录到 D: 门路
第二行：将 jre 命令增加到长期环境变量中
keytool -genkey -alias 别名 -keyalg RSA -keysize 2048 -validity 36500 -keystore 证书名称.keystore

testalias 是证书别名，可批改为本人想设置的字符，倡议应用英文字母和数字
test.keystore 是证书文件名称，可批改为本人想设置的文件名称，也能够指定残缺文件门路
36500 是证书的有效期，示意 100 年有效期，单位天，倡议工夫设置长一点，防止证书过期
2.

Enter keystore password: // 输出证书文件明码，输出实现回车

Re-enter new password: // 再次输出证书文件明码，输出实现回车

What is your first and last name?

What is the name of your organizational unit?

What is the name of your organization?

What is the name of your City or Locality?

What is the name of your State or Province?

What is the two-letter country code for this unit?

Is CN=XX, OU=XX, O=XX, L=XX, ST=XX, C=XX correct?

Enter key password for <testalias>

    (RETURN if same as keystore password):  // 确认证书明码与证书文件明码一样（HBuilder|HBuilderX 要求这两个明码统一），间接回车就能够

查看证书信息
在一些领取 / 地图配置时须要用到 MD5 SHA1 等指纹信息

能够应用以下命令查看:

keytool -list -v -keystore test.keystore

Enter keystore password: // 输出明码，回车

会输入以下格局信息：

Keystore type: PKCS12

Keystore provider: SUN

Your keystore contains 1 entry

Alias name: test

Creation date: 2019-10-28

Entry type: PrivateKeyEntry

Certificate chain length: 1 Certificate[1]:

Owner: CN=Tester, OU=Test, O=Test, L=HD, ST=BJ, C=CN

Issuer: CN=Tester, OU=Test, O=Test, L=HD, ST=BJ, C=CN

Serial number: 7dd12840

Valid from: Fri Jul 26 20:52:56 CST 2019 until: Sun Jul 02 20:52:56 CST 2119

Certificate fingerprints:

MD5: xxxxxxx

SHA1: xxxxxxx

SHA256: xxxxxxxxx

Signature algorithm name: SHA256withRSA

Subject Public Key Algorithm: 2048-bit RSA key

Version: 3

至此就能够在生成的目录下取得一个结尾为.keystore 文件, 接下来就能够打包了。

在打包配置中顺次填入上述文件的配置信息就能够开始打包了。平时开发中倡议打测试包，正式包每天只有 5 次的打包机会，不要为此影响了你的正式公布哦~

IOS：

IOS 的证书文件获取绝对简单许多。

iOS 有两种证书和形容文件：

证书类型

应用场景

开发 (Development) 证书和形容文件

用于开发测试，在 HBuilderX 中打包后可在真机环境通过 Safari 调试

公布 (Distribution) 证书和形容文件

用于提交 AppStore，在 HBuilderX 中提交云打包后提交到 AppStore 审核公布

筹备环境
必须要有苹果开发者账号，并且退出了“iOS Developer Program”
Mac OS 10.9 以上零碎（如果曾经申请 p12 证书则不须要）
登录 iOS Dev Center
页面右侧抉择“Certificates,IDs & Profiles”进入证书治理页面.

申请开发证书、公布证书及绝对应的形容文件。

首先须要申请苹果 App ID（App 的惟一标识）
抉择页面的“Identifiers” 可查看到已申请的所有 App 利用标识，点击页面上的加号来创立一个新的利用标识：

抉择标识类型为“App IDs”，而后点击“Continue”

平台抉择“iOS，tvOS，watchOS”，Bundle ID 抉择“Explicit”，在 Description 中填写形容，而后填写 Bundle ID，Bundle ID 要放弃唯一性，倡议填写反域名加利用标识的格局 如：“io.dcloud.hellouniapp”，而后点击“Continue”
留神：在 HBuilderX 中 App 提交云端打包时界面上的 AppID 栏填写的就是这个 Bundle ID

至此，App ID 曾经创立结束，接下来开始创立开发证书，在创立开发证书前，须要学生成证书申请文件

生成证书申请文件
不论是申请开发 (Development) 证书还是公布 (Distribution) 证书，都须要应用证书申请 (.certSigningRequest) 文件，证书申请文件需在 Mac OS 上应用“钥匙串拜访”工具生成。

在“Spltlight Search”中搜寻“钥匙串”并关上“钥匙串拜访”工具

关上菜单“钥匙串拜访”->“证书助理”，抉择“从证书颁发机构申请证书 …”

关上创立申请证书页面，在页面中输出用户邮件地址、罕用名称，抉择存储到磁盘，点击“持续”
文件名称为“CertificateSigningRequest.certSigningRequest”，抉择保留地位，点击“存储”将证书申请文件保留到指定门路下，前面申请开发 (Development) 证书和公布 (Production) 证书时须要用到

申请开发 (Development) 证书和形容文件
开发 (Development) 证书及对应的形容文件用于开发阶段应用，能够间接将 App 装置到手机上，一个形容文件最多绑定 100 台测试设施（开发证书不能用于公布利用到 App Store）。

申请开发 (Development) 证书
在证书治理页面抉择“Certificates” 可查看到已申请的所有证书（TYPE：Development 为开发证书，Distribution 为公布证书），点击页面的加号来创立一个新的证书：
在“Software”栏下选中“iOS App Development”而后点击“Continue”
接下来须要用到刚刚生成的证书申请文件，点击“Choose File…”抉择刚刚保留到本地的“CertificateSigningRequest.certSigningRequest”文件，点击“Continue”生成证书文件
生成证书后抉择“Download”将证书下到本地 (ios_development.cer)
双击保留到本地的 ios_development.cer 文件，会主动关上“钥匙串拜访”工具阐明导入证书胜利，能够在证书列表中看到刚刚导入的证书，接下来须要导出 .p12 证书文件，选中导入的证书，右键抉择“导出 …”
输出文件名、抉择门路后点击“存储”
输出明码及确认明码后点击“好”

至此，咱们曾经实现了开发证书的制作（失去了 xxx.p12 证书文件），接下来，持续生成开发阶段所需的形容文件，在生成形容文件之前，须要先增加调试设施（iPhone、iPad）

增加调试设施
开发形容文件必须绑定调试设施，只有受权的设施才能够间接装置 App，所以在申请开发形容文件之前，先增加调试的设施。
(如果曾经增加设施，可跳过此节)

在证书治理页面抉择“Devices”，可查看到已增加的所有设施信息，点击页面上的加号来增加一个新设施
填写设施名称 和 UDID（设施标识）

申请开发 (Development) 形容文件
在证书治理页面抉择“Profiles”，可查看到已申请的所有形容文件，点击页面上的加号来增加一个新的形容文件
在“Development”栏下选中“iOS App Development”，点击“Continue”按钮
这里要抉择之前创立的“App ID”(这里是“io.dcloud.hellouniapp”)，点击“Continue”
接下来抉择须要绑定的证书，这里倡议间接勾选“Select All”，点击“Continue”
抉择受权调试设施，这里倡议间接勾选“Select All”，点击“Continue”
输出形容文件的名称（如“HelloUniAppProfile”）, 点击“Generate”生成形容文件
点击“Download”下载保留开发形容文件（文件后缀为 .mobileprovision）

至此，咱们曾经失去了开发证书（.p12）及对应的形容文件（.mobileprovision），接下看一下如何制作公布证书及公布形容文件

申请公布 (Distribution) 证书和形容文件
公布 (Production) 证书用于正式公布环境下应用，用于提交到 Appstore 审核公布。公布证书打包的 ipa，不能够间接装置到手机上

申请公布 (Production) 证书
在证书治理页面抉择“Certificates” 可查看到已申请的所有证书（TYPE：Development 为开发证书，Distribution 为公布证书），点击页面的加号来创立一个新的证书
在“Software”栏下选中“App Store and Ad Hoc”，点击“Continue”
接下来同样须要用到之前生成的证书申请文件，点击“Choose File…”抉择刚刚保留到本地的“CertificateSigningRequest.certSigningRequest”文件，点击“Continue”生成证书文件
生成证书胜利，抉择“Download”将证书下载到本地 (ios_production.cer)
同样双击保留到本地的 ios_production.cer 文件将证书导入到“钥匙串拜访”工具中，能够在证书列表中看到刚刚导入的证书，接下来须要导出 .p12 证书文件，选中导入的证书，右键抉择“导出 …”

这里留神证书后面有三角标的能力导出为.p12 文件

输出文件名、抉择门路后点击“存储”
输出明码及确认明码后点击“好”

至此，咱们曾经实现了公布证书的制作（失去了 xxx.p12 证书文件），接下来，持续生成公布形容文件

申请公布 (Distribution) 形容文件
在证书治理页面抉择“Profiles”，可查看到已申请的所有形容文件，点击页面上的加号来增加一个新的形容文件
在“Distribution”栏下选中“App Store”，点击“Continue”按钮
这里要抉择之前创立的“App ID”(这里是“io.dcloud.hellouniapp”)，点击“Continue”
接下来抉择须要绑定的公布证书（iOS Distribution），这里勾选刚刚生成的公布证书”，点击“Continue”
接下来输出形容文件的名称（如“HelloUniAppProfileDistribution”）, 点击“Generate”生成形容文件
而后点击“Download”将形容文件下载到本地（文件后缀为 .mobileprovision）

好了，当初咱们曾经失去了公布证书（.p12）及对应的公布形容文件（.mobileprovision）

END

如果你感觉这篇文章对你有点用的话，麻烦请给咱们的开源我的项目点点 star: http://github.crmeb.net/u/defu 不胜感激！