H5应用可以打包生成苹果或安卓原生应用，一般也称为混合应用程序(Hybird App)。
并不是所有的H5应用都适合打包成原生应用，如果把一个普通的手机网站包装成原生应用，即使它制作的外观像是原生应用，
但切换页面时的网页刷新和加载导致速度慢、费流量、体验差，并不适合制作APP，而且像苹果应用市场等也容易拒绝此类APP上架。
为了接近原生应用的用户体验，可打包的H5应用应是支持多逻辑页的单网页应用，也就是变脸式应用。
我们制作的原生应用最大的特点是它与H5应用是分离的，从而在应用市场上架后仍可随时轻松升级应用。
这种应用我们也把它称为原生壳。
编译原生壳
[任务]
- 一次开发，多平台运行：将我们制作的H5应用打包生成原生APP安装到安卓及苹果手机上。
- 一次上线，轻松升级：更新H5应用并上线，查看已安装的原生应用是否已自动及时更新。
准备工作：
- 云编译环境，安装Intel XDK，注册好用户帐号。
- 安卓和苹果的应用证书。安卓证书可以自行制作，苹果证书须注册苹果开发者帐号后生成。
使用Intel XDK的最大挑战是网络。在国内访问可能有问题，或者很慢，或者连不上。必要时可以使用VPN代理等手段连接。
打开Intel XDK，创建一个新的”Html5+Cordova”项目：
点左上角的”PROJECTS”，进入项目设置，里面有插件管理(Plugin Management)，编译设置(Build Settings)和图标及启动画面设置(Launch Icons and Splash Screens)。
插件是各种手机原生语言开发的库，比如相机、支付宝及微信支付等，本节不做重点介绍。图标和启动画面比较简单，准备好图片选上就行。
编译设置中要注意需要每个平台分别设置，请特别注意：
- 在访问权限中，在”Navigation”栏中，设置为”*”，表示允许访问外网地址。
- 安卓及苹果的开发证书在软件右上角用户帐号中先添加好，才能在编译设置中选择。
- 安卓有个选项“Optimize with crosswalk”，用于把浏览器与应用一起打包以便在各种安卓手机上有良好的兼容性，缺点是生成的包要大20M。
练习时可不选，实际项目中建议选上。
xdk项目目录下的文件intelxdk.config.additions.xml中，设置上H5应用的地址，加上这句：
<content src="http://myserver/myproject/index.html?cordova=1" />
注意，H5应用后面加上参数cordova={壳版本}，框架将识别这个参数，进入原生应用模式，自动加载插件接口。
还有找到debuggable选项把它设置为true，以便可以之后在电脑上连接设备调试H5应用。
<preference name="debuggable" value="true" />
配置好后，进入编译页，开始编译。
编译好后，先不要立即安装到手机上，还有重要的一步，将插件接口更新到H5应用中去，这样在H5应用中可调用原生功能。
更新原生插件接口到H5应用。
用winzip等工具解压生成的apk名或ipa包（可以先改名为.zip文件再点开），在安卓apk包的assets/www目录中（或苹果ipa包的Payload/{应用名}.app/www目录下），找到以下三个文件或目录：
cordova.js
cordova_plugins.js
plugins/ （整个目录）
把安卓APP中的这些文件复制到H5应用的目录server/cordova下面，把苹果APP中的这些文件复制到server/cordova-ios下面。这样就完成了H5应用中设置原生插件接口。
注意：当H5项目中有多个应用时，plugins目录直接取并集即可，而cordova_plugins.js文件需要小心合并。
这时将apk包或ipa包安装到手机上，打开应用程序，看看是否能正常运行。
我们在H5应用中书写代码时，可以检查全局变量g_cordova。
例如，想要仅在原生应用中显示某个页面，在微信或浏览器中访问时提示错误：
if (! g_cordova) {
app_alert("本功能请在APP中点击进入");
return;
}
MUI.showPage("#xxx");