集成到LightApp

发布JSNative包

将JSNative包发布到 Light 平台,可以发布为H5云组件离线包

集成

离线包模式

通过配置化的方法将 JSNative 包集成在 LightApp 的 菜单上,打包后即可访问。

module.exports = {
menuBar:{
backgroundColor:"",//背景色
defaultColor:"",//默认菜单颜色
selectedColor:"",//菜单选中颜色

//使用字体图标自动生成图片,省去了开发者自己制作多张图的问题
iconFontFrom:"",

menus:[{
text:'远程',//菜单的文本
icon:'0xabcd',//菜单图标在字体中的码点可以查看对应的css文件了解具体的码点,具体格式为0xabcd
view:"index1",//当前菜单对应的视图名称,视图必须在views属性中定义
}, {
text:'离线包',
icon:'0xabcd',
view:"index2",
}]
},
views:{
"index1":{
url:"http://hgutg.lightyy.com/app.native.js",//填写发布到 light 平台的H5云组件地址
navBar:{
title:"",
backgroundColor:"",
titleColor:""
}
},
"index2":{
url:"xxxx.vhost.light.com/app.native.js",//填写发布到 light 平台的离线包地址
navBar:{
title:"",
backgroundColor:"",
titleColor:""
}
},
}
};

本地包模式

App 工程打包时会将本工程的视图页面打包到 www 目录下,本地包模式就是将这里的内容配置到 App 的菜单上。

module.exports = {
menuBar:{
backgroundColor:"",//背景色
defaultColor:"",//默认菜单颜色
selectedColor:"",//菜单选中颜色

//使用字体图标自动生成图片,省去了开发者自己制作多张图的问题
iconFontFrom:"",

menus:[{
text:'本地包',//菜单的文本
icon:'0xabcd',//菜单图标在字体中的码点可以查看对应的css文件了解具体的码点,具体格式为0xabcd
view:"index1",//当前菜单对应的视图名称,视图必须在views属性中定义
}]
},
views:{
"index1":{
url:"app.native.js",//填写www目录下的地址
navBar:{
title:"",
backgroundColor:"",
titleColor:""
}
}
}
};