小程序快速开发

准备开发环境

1.安装开发者工具

若本地已安装了lighting工具，直接升级至最新版本即可

npm install lighting -g

若本地尚未安装，请先安装lighting工具。

2.安装 miniprogram 插件

light plugin -a miniprogram2

老版miniprogram插件安装(不再更新)

light plugin -a miniprogram

创建开发工程

$ light create -t mp

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

├── build
├── dist
├── 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

• build 主要存放编译后light小程序资源。
• dist 主要存放编译后资源，其中包含三个子目录，wx、web、light分别对应微信小程序、web运行时和light小程序三种不同的运行环境所需要使用的资源。
• project.json小程序的配置文件和主要的工程描述文件。

小程序的所有源代码均位于src目录当中，该目录中的目录结构与微信小程序的源代码组织方式并无二致。

• src/app.js小程序的主要入口文件，用于定义小程序应用级别的生命周期和全局逻辑。
• src/app.json小程序的运行时配置文件，用于定义容器与资源状态。
• src/app.wxss 全局的通用样式文件。
• src/pages 主要包含小程序的视图，每一个page都需要定义在src/app.json才可以被编译和使用，每一份配置文件均最多包含js/wxml/wxss/json四种文件，分别代码逻辑、结构、样式、配置四种视图信息。

编译运行工程

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

$ light release -wb

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

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

查看日志

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

App({
  //
})
try {//true表示开启，默认为false
  __base__.DEBUG_MODE = true; // 开启vConsole
  __base__.DEBUG_SHOW_NETWORK_INFO = true; // 显示network请求信息
} catch(err) {
  // 由于在微信开发者工具中无法找到 __base__ 对象，需要为此配置添加 try...catch 写法方能正常在微信开发者工具中运行项目代码
}

打包

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

$ light release -p

访问小程序

小程序打包发布后，可以运行在LightApp环境中，由H5/JSNative页面跳转至小程序页面即可访问该小程序。

打开独立窗体的小程序：

Light.navigate("gmu://miniapp", 
  {
    id: 'xxxxxxxxxx'  //Light平台对应的小程序id
  }
)

打开远程小程序：

Light.navigate("https://xxx.lightyy.com/app.miniapp.js", //远程小程序的访问地址
  {
    a: 1, //参数
    b: 2
  }, {
    miniappContainer: 'miniapp'
  }
)

指定miniprogram版本

若需要指定miniprogram插件版本，则需手动在project.json中的plugins指定，不可同时指定两个版本。

版本2(最新版本):

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

版本1(不再更新)

{
  "plugins": ["miniprogram"],
}