小程序App化的简介

准备开发环境

在已安装小程序开发环境的情况下，还需要安装app的插件

light plugin -a native

创建开发工程

$ light create -t mp-app

light小程序工程目录结构大致如下：

├── build
├── dist
├── native
│   └── res
│        └── icon.png
│        └── launch.png
│   └── config.js
│   └── LIGHT_LICENSE
│   └── iconfont.ttf
├── project.json
├── src
│   ├── app.js
│   ├── app.json
│   ├── app.wxss
│   ├── image
│   │   ├── arrowright.png
│   │   └── wechat.png
│   ├── pages
│   │   ├── index
│   │   │   ├── index.js
│   │   │   ├── index.json
│   │   │   ├── index.wxml
│   │   │   └── index.wxss     
│   │   │── logs
│   │   │       ├── logs.js
│   │   │       ├── logs.json
│   │   │       ├── logs.wxml
│   │   │       └── logs.wxss
│   └── utils
│       └── util.js

具体文件结构可以分别参照小程序和Light的对应文件

编译运行工程

通过下面的指令可以将工程的源代码编译，编译成功后，工具会自动打开浏览器，并打开项目的http地址，至此每一次对源代码的修改都会触发页面内容的自动编译和热更新，可以使开发者在无感知的情况下快速开发。浏览器仅展示web环境下的效果，实际小程序的运行效果可以在下一步的调试中查看。

$ light release -wb

在浏览器控制台会打印预览二维码，分别是H5和小程序：

用 LightView 扫描浏览器控制台的小程序预览二维码，即可预览效果。

查看日志

在 app.js 中加入如下代码，即可开启 vConsole，方便在下一步预览过程中查看日志。注：不要在生命周期中设置。

App({
  //
})
__base__.DEBUG_MODE = true; //true表示开启，默认为false

打包

执行以下命令可进行打包，打成功的zip包可发布到Light平台。详情参考App集成打包。

$ light release -p

离线包预置与更新

通过配置vhostId设置小程序离线包预置ID(默认为main)
通过配置vhostVersion设置小程序离线包预置版本(默认为0.0.0)

参考project.json配置

插件配置和离线包预置参考配置

{
    "plugins":["miniprogram2","native"],
    "pluginConfig":{
        "native":{
            "vhostId": "main",
            "vhostVersion": "0.0.1"
        }
    }
}

小程序App化可通过离线包更新业务代码，具体参考App离线包功能

小程序离线包id必须和APP化的小程序配置中vhostId相同，小程序离线包版本必须和vhostVersion版本号不同

现有小程序App化

1.project.json中plugins加上native插件，如下

{
    "plugins":["miniprogram2","native"],
}

2.增加native文件夹及内部内容，配置App相关的部分配置，详情参考App配置。

兼容性：

小程序App化后部分接口不可使用：

不兼容接口
wx.showNavigationBarLoading
wx.getMenuButtonBoundingClientRectSync
wx.navigateBackMiniProgram
wx.authorize
wx.login
wx.checkSession
gmu.getSensitiveInfo
getWhiteList

注意：

1.小程序App化需要在小程序配置中的tabBar.list至少配置一条，否则无法打包
2.小程序App化在打包时会读取配置文件.json并固定到App中，后期使用离线包功能无法更新配置，若要更新配置，需要重新打包集成App。
3.小程序App化的如导航栏，菜单栏等全局页面配置的信息不再通过native/config.js配置，而是按照小程序app.json和页面对应的json配置,其他相关配置还是需要native/config.js。