Cordova小知识

一、概念知识

• Cordova：Cordova 能够将你的 HTML/JS 代码打包在一个原生的容器中运行，并且可以调用系统的各类软硬件接口（JavaScript API）。我们将这种架构称之为 hybrid app , 得益于这种架构，我们能将前端代码跨平台运行，并且得到接近原生应用的系统特性。最终发布到各大应用市场，包括苹果的 App Store。
• Cordova插件：Cordova 通过插件的生态系统为开发者提供了广泛的软硬件接口支持，诸如文件读写、推送通知、解压缩、通讯录等等。这种方式保证了在开发过程中按需引入相应的功能插件，同时也加快了插件的更新维护，减少代码冗余。Cordova 插件使用 CLI 的方式经过 NPM 管理依赖并安装，十分方便。
• Cross-walk：Cross-walk 是英特尔开发的一款为HTML应用提供运行时环境的开源项目，它基于最新的 Chromium 核心开发，可以提供最新的 Web 特性和一致的兼容性。随着 Cordova Android 4.0.0+ 引入了对嵌入式 webview 的支持，现在你可以方便地在你的 Cordova 应用上使用 Crosswalk 的 webview。通过使用 Crosswalk 的 webview 插件，开发者可以享用远程调试的功能，前沿的 HTML5 特性，例如WebGL, WebAudio 和 WebRTC，以及在包括 Android 4.0 Ice Cream Sandwich(ICS) 在内的 Android 设备上性能的显著提升。
• CodePush：CodePush 是微软提供的一项云服务，它为开发者提供了直接向用户推送热更新 (Hot-Code-Update) 的软件支持和 CDN 分发网络。CodePush 为 Cordova 开发者提供了插件，我们可以快速地植入应用中。它提供的特性包括：版本管理、灰度更新、紧急回滚、增量更新 (Diff) 等等。它的 CDN 是世界上最大的 CDN 服务商 Akamai 提供的，稳定性和速度可想而知。未来可能收费

二、创建并运行项目

官方文档地址：https://cordova.apache.org/

安装命令：

cordova create hello com.example.hello HelloWorld
# hello是文件夹
# com.example.hello 是包名
# helloworld是app名字

1、运行ios模拟器时，需要指定版本

查看当前的模拟器：

$ ./platforms/ios/cordova/lib/list-emulator-images
iPhone-4s
iPhone-5
iPhone-5s
iPhone-6-PlusiPhone-6
iPad-2

iPad-Retina

iPad-Air
Resizable-iPhone
Resizable-iPad

使用命令：

cordova run ios --target  iPhone-5
#iPhone 总是会不小心写错成 iphone

2、使用ios真机调试必须先安装ios-deploy但是sudo npm install -g ios-deploy是报错的，issue参靠链接：

https://github.com/phonegap/ios-deploy/issues/188

你要是懒得看英文，那就这个吧：

http://blog.csdn.net/cooldragon/article/details/50925633

最终安装命令：

sudo npm install -g ios-deploy --unsafe-perm=true

如果你安装过ios-deploy,使用模拟器就必加–emulator命令，示例：

cordova run ios --emulator --target  iPhone-5

三、使用 Cordova 插件引入 Cross-walk webview

在实际开发中，会遇到 Android 系统版本落后，原生 webview 性能差兼容性差的问题，所以我们要用 Cross-walk 替换原生的 Android webview 来运行我们的项目。 Cross-walk 开发社区已经为我们准备好了 Cordova 插件，只需要运行：  

cordova plugin add cordova-plugin-crosswalk-webview@latest —save  

成功安装后再次 cordova build android ，你会发现输出了两个 apk 文件，一个对应 arm 平台，一个对应 x86 平台，体积相较原来的文件增加了 20M 左右，多出来的体积便是 crosswalk-webview 的 runtime。

你也可以在项目的 config.xml 中设置：

<plugin name="cordova-plugin-crosswalk-webview" spec="~2.2.0">
    <variable name="XWALK_VERSION" value="22+" />
    <variable name="XWALK_LITEVERSION" value="xwalk_core_library_canary:17+" />
    <variable name="XWALK_COMMANDLINE" value="--disable-pull-to-refresh-effect" />
    <variable name="XWALK_MODE" value="embedded" />
    <variable name="XWALK_MULTIPLEAPK" value="true" />
</plugin>

把 XWALK_MULTIPLEAPK 的 value 设置为 false，即可打包出一个整合两个平台的 apk 包，当然，体积会暴增至 40M+。

四、使用 Chrome 调试 Cross-walk webview 中的项目

由于 Cross-walk 基于 Chromium，天生便具有了 Chrome 远程调试的功能。 电脑连接 Android 手机并开启 USB 调试模式，打开你的 Cordova 项目后，在 Chrome 浏览器地址栏中输入 chrome://inspect ，选择你的设备，即可打开远程控制台，真机调试变得十分方便。Vue Devtool 同样可以在此使用。

五、iOS 的小优化 将 UIWebView 替换为 WKWebView

WKWebView 是苹果在 iOS 8 中引入的新组件，目的是给出一个新的高性能的 Web View 解决方案，摆脱过去 UIWebView 的老旧笨重特别是内存占用量巨大的问题（打开一个示例项目，WKWebView 占用23M，而 UIWebView 占用85M）。

在这里我们将使用 WKWebView 替换 Cordova 默认的 UIWebView：

cordova plugin add cordova-plugin-wkwebview-engine@latest --save

并在 config.xml 的  中添加：

<feature name="CDVWKWebViewEngine">
    <param name="ios-package" value="CDVWKWebViewEngine" />
</feature>