Skip to content

common How To Get Started

Jump to bottom
pricelesss edited this page May 16, 2018 · 4 revisions

How To Getting Started

Web Getting Started

1.init project

with lite-app-init , you can init your project according to following command

npm install --save -g liteapp-init #install liteapp-init global
mkdir my-project   #create your project dir
cd my-project
lite-app-init && npm install -d

you may get a problem with installing node-sass , refer to the issue

https://github.com/lmk123/blog/issues/28

3.set your custom app.json

lite-app-cli create a default app.json for you , but you may set it yourself liteapp-cli will make the bundle with your settings in app.json, so it's important

param must default meaning
name yes -- the name of your project
version.base yes -- base version , set in liteapp-base/base/version.json , 1.2 is now enabled
version.business yes -- business version , version control of lite-app
src yes "./" path of code source
res yes "./" path of static resource
target yes "./" dist path
pages yes -- page array
page.name yes -- your page name
page.path yes -- your page path in src
index no -- page name that u want to set index
tabbar.items no -- tabbar setting

eg :

{
    "name" : "hello-world",
    "version" : {
        "business" : "1.0",
        "base" : "1.2"
    },
    "src" : "./src",
    "res" : "./res",
    "target" : "./dist",
    "pages": [
        {
            "name": "index",
            "path": "/entry/index" 
        }
    ],
    "index": "index",
	"tabbar": {
		"items": 
		[
			{
				"path" : "index",
				"unselectedIcon": "/images/tab-home.png",
				"selectedIcon": "/images/tab-home-selected.png",
				"title": "首页"
			}
		]
	}

}

4.get started

# development
lite-app --config ./app.json --env dev --target web

# production
lite-app --config ./app.json --env prod --target app

view in web (development type) ：

https://locahost:8080/pages/${bundleName}/web.html

scripts in package.json will be better

tips : user lite-app cli without install package globally will cause the error [command not found in path] refer to package.json docs in npm https://docs.npmjs.com/files/package.json#bin

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "lite-app --config ./app.json --env dev --target web",
    "build": "lite-app --config ./app.json --env prod --target app"
  },
lite-app cli : params
  • config : path to your app.json
  • env 1.dev : development mode，with file watching and wont create any file in your project 2.prod : create the package for liteapp native to use
  • target
  1. app : will run in app（use native api & component）
  2. web : will run in web（native api & component will be polyfilled ）

Android Getting Started

小程序有两种启动模式，分别为小程序包启动模式和小程序页面启动模式，每种模式均支持离线化和预热加载，在尚未进行预热的情况下，也仍然可以正确加载并展示小程序页面。

小程序包模式

小程序包模式会加载一个具有特定 ID 的程序包，小程序包是一个zip文件，并且需要包含一conf/Manifest.js 声明文件，用于声明小程序包含的各个页面以及对应的小程序框架版本。 需要用小程序包模式启动时，可以调用如下方法：

/**
* 使用这个方法启动一个小程序包
* @param miniProgramID 需要启动的小程序包的ID
* @param needUpdate 小程序包是否需要进行更新
* @param context 传入Android上下文
**/
public static void startMiniProgram(String miniProgramID, boolean needUpdate, Activity context)

小程序页面模式

小程序页面模式需要开发者自行获取小程序页面代码，并且启动一个独立的小程序页面,与小程序包模式类似

/**
* 使用这个方法启动一个小程序单页面
* @param pageJS 小程序页面javascript
* @param context 传入Android上下文
*/
public static void startMiniProgramSinglePage(String pageJS,Activity context)

小程序预热

小程序会使用webview作为显示容器，因webview需要一定时间才能完成首次加载，我们可以根据自己的情况进行小程序预热，在预热时会在webview中启动小程序框架，所以预热仅可以对最近几个框架版本的小程序生效，不再兼容的小程序启动时 会运行在兼容模式，不能使用预热完成的容器。

/**
* 使用这个方法预热小程序
* @param count 预热的容器个数
* @param context 传入Android上下文
*/
public static void prepareMiniProgram(int count,Activity context)

小程序清理

小程序会启动一个单独的进程运行，如果需要清理小程序进程，可以调用下列API

/**
* 使用这个方法清理小程序
* @param context 传入Android上下文
*/
public static void killMiniProgram(Activity context)

Clone this wiki locally