跨平台开发方法、跨平台开发系统及电子设备技术方案

技术编号:24888210 阅读:67 留言:0更新日期:2020-07-14 18:15
本发明专利技术实施例涉及一种跨平台开发方法、跨平台开发系统及其电子设备。所述跨平台开发方法包括:通过转换器,将Vue源码转换为JS包;在服务器中部署所述JS包;根据终端的请求,将所述JS包下发至所述终端;在所述终端中,由JS框架接收和执行所述JS包;由所述JS框架发送渲染指令至本地;通过在本地的渲染引擎进行渲染。其以web的开发体验构建高性能、高复用,可扩展的native应用。前端开发人员通过简单学习即可上手业务开发,并且使用一套编码即可在移动端Android、iOS和web端等多平台运行,开发成本大大降低,还提供了预加载、离线包,提高了性能、减少了版本迭代周期。

【技术实现步骤摘要】
跨平台开发方法、跨平台开发系统及电子设备
本专利技术涉及电子信息
,尤其涉及一种跨平台开发方法、跨平台开发系统及其电子设备。
技术介绍
传统的本地(Native)开发存在开发成本高、版本迭代周期长、响应速度慢、人员配置多等的情况,很难跟上现阶段企业日益扩大的规模,满足企业的业务上需要迭代快速,上线快速,也需要多容器,多项目接入等的使用需求。例如,传统App的整包更新成本偏大,还需市场审核,周期较长,不利于App的快速迭代发展,而且在开发安卓、IOS和Web端等不同的平台的应用时,同一需求在原生开发下需要iOS端、Android端等不同的开发人员。因此,迫切需要提供一种新的跨平台开发方式,以满足企业规模迅速扩展的需求。
技术实现思路
本专利技术实施例提供一种跨平台开发方法、跨平台开发系统及其电子设备,旨在解决现有开发方式所存在的一系列缺陷。本专利技术实施例提供以下技术方案:一种跨平台开发方法。该方法包括:通过转换器,将Vue源码转换为JS包;在服务器中部署所述JS包;根据终端的请求,将所述JS包下发至所述终端;在所述终端中,由JS框架接收和执行所述JS包;由所述JS框架发送渲染指令至本地;通过在本地的渲染引擎进行渲染。可选地,所述通过转换器将Vue源码转换为JS包,具体包括:将模板标签转换为类JSON的树状数据结构,转换数据绑定为返回数据的函数原型;将类型标签转换为类JSON的树状数据结构;结合模板标签和类型标签转换后的内容,以及脚本标签中的内容为一个JS异步模块规范模块。可选地,所述由JS框架接收和执行所述JS包,具体包括:由JS框架提供每个所述JS包调用的define函数和bootstrap函数;执行define函数用以注册模块,并且执行bootstrap函数进行编译;发送对应的渲染指令至本地。可选地,通过在本地的渲染引擎进行渲染,具体包括:由本地的渲染引擎提供与渲染指令对应的客户端组件及模块。可选地,所述本地与JS框架之间通过呼叫本地和呼叫JS两个接口进行通信。本专利技术另一实施例提供以下技术方案:一种跨平台开发系统。跨平台开发系统包括:转换器,用于将Vue源码转换为JS包;服务器,用于部署所述JS包,并且根据终端的请求,将所述JS包下发至终端;JS框架,所述JS框架在所述终端中,用于接收和执行所述JS包,并发送对应的渲染指令;渲染引擎,所述渲染引擎用于执行所述渲染指令进行渲染。可选地,还包括呼叫本地接口和呼叫JS接口,用于JS框架与本地之间的通信。可选地,还包括若干个可复用的组件,所述可复用的组件包括:缓存、通讯录、文件、IM即时通讯、网络、推送、数据库。本专利技术另一实施例提供以下技术方案:一种电子设备,包括:处理器、存储器、通信接口和通信总线,所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信;所述存储器用于存放至少一可执行指令,所述可执行指令使所述处理器执行如上所述的跨平台开发方法。与现有技术相比较,本专利技术实施例提供的跨平台开发方法以web的开发体验构建高性能、高复用,可扩展的native应用。前端开发人员通过简单学习即可上手业务开发,并且使用一套编码即可在移动端Android、iOS和web端等多平台运行,开发成本大大降低,还提供了预加载、离线包,提高了性能、减少了版本迭代周期。进一步地,跨平台开发系统还可以提供丰富的组件(如缓存、通讯录、文件、IM即时通讯、网络、推送、数据库等),实现了复用性,也降低了开发成本,让程序员更加专注业务需求上。【附图说明】一个或多个实施例通过与之对应的附图中的图片进行示例性说明,这些示例性说明并不构成对实施例的限定,附图中具有相同参考数字标号的元件表示为类似的元件,除非有特别申明,附图中的图不构成比例限制。图1为本专利技术实施例提供的跨平台开发方法的示意图;图2为本专利技术实施例提供的跨平台开发的示意图;图3a为本专利技术实施例提供的缓存组件的示意图;图3b为本专利技术实施例提供的通讯录组件的示意图;图3c为本专利技术实施例提供的文件组件的示意图;图3d为本专利技术实施例提供的IM即时通讯组件的示意图;图3e为本专利技术实施例提供的网络组件的示意图;图3f为本专利技术实施例提供的推送组件的示意图;图3g为本专利技术实施例提供的数据库组件的示意图;图4为本专利技术实施例提供的电子设备的示意图。【具体实施方式】为了便于理解本专利技术,下面结合附图和具体实施例,对本专利技术进行更详细的说明。需要说明的是,当元件被表述“固定于”另一个元件,它可以直接在另一个元件上、或者其间可以存在一个或多个居中的元件。当一个元件被表述“连接”另一个元件,它可以是直接连接到另一个元件、或者其间可以存在一个或多个居中的元件。本说明书所使用的术语“上”、“下”、“内”、“外”、“底部”等指示的方位或位置关系为基于附图所示的方位或位置关系,仅是为了便于描述本专利技术和简化描述,而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作,因此不能理解为对本专利技术的限制。此外,术语“第一”、“第二”“第三”等仅用于描述目的,而不能理解为指示或暗示相对重要性。除非另有定义,本说明书所使用的所有的技术和科学术语与属于本专利技术的
的技术人员通常理解的含义相同。本说明书中在本专利技术的说明书中所使用的术语只是为了描述具体的实施例的目的,不是用于限制本专利技术。本说明书所使用的术语“和/或”包括一个或多个相关的所列项目的任意的和所有的组合。此外,下面所描述的本专利技术不同实施例中所涉及的技术特征只要彼此之间未构成冲突就可以相互结合。图1为本专利技术实施例提供的跨平台开发方法的示意图。如图1所示,所述方法包括:110:通过转换器,将Vue源码转换为JS包。亦即将后缀名为.vue,由<template>、<style>和<script>等标签组织好的内容,通过transformer(转换器)转换成JSBundle(JS包)。具体的,Vue源码的转换过程可以包括:首先,将模板标签<template>转换为类JSON的树状数据结构,转换数据绑定为返回数据的函数原型,并且将类型标签<style>转换为类JSON的树状数据结构。然后,将模板标签<template>转换后的内容、类型标签<style>转换后的内容以及脚本标签<script>中的内容结合为一个JavaScriptAMD模块(JS异步模块规范模块)。120:在服务器中部署所述JS包。130:根据终端的请求,将所述JS包下发至所述终端。该终端可以是Web端、iOS端或Android端等多种不同的平台。在接收到终端的请求以后,JSBundle即可下发给终端。140:在所述终端中,由JS框架接收和执行所述JS包。JS框架(JSFramework)接收和执行所述JS包,并且执行数据绑本文档来自技高网
...

【技术保护点】
1.一种跨平台开发方法,其特征在于,包括:/n通过转换器,将Vue源码转换为JS包;/n在服务器中部署所述JS包;/n根据终端的请求,将所述JS包下发至所述终端;/n在所述终端中,由JS框架接收和执行所述JS包;/n由所述JS框架发送渲染指令至本地;/n通过在本地的渲染引擎进行渲染。/n

【技术特征摘要】
1.一种跨平台开发方法,其特征在于,包括:
通过转换器,将Vue源码转换为JS包;
在服务器中部署所述JS包;
根据终端的请求,将所述JS包下发至所述终端;
在所述终端中,由JS框架接收和执行所述JS包;
由所述JS框架发送渲染指令至本地;
通过在本地的渲染引擎进行渲染。


2.根据权利要求1所述的方法,其特征在于,所述通过转换器,将Vue源码转换为JS包,具体包括:
将模板标签转换为类JSON的树状数据结构,转换数据绑定为返回数据的函数原型;
将类型标签转换为类JSON的树状数据结构;
结合模板标签和类型标签转换后的内容,以及脚本标签中的内容为一个JS异步模块规范模块。


3.根据权利要求1所述的方法,其特征在于,所述由JS框架接收和执行所述JS包,具体包括:
由JS框架提供每个所述JS包调用的define函数和bootstrap函数;
执行define函数用以注册模块,并且执行bootstrap函数进行编译;
发送对应的渲染指令至本地。


4.根据权利要求1所述的方法,其特征在于,通过在本地的渲染引擎进行渲染,具体包括:
由本地的...

【专利技术属性】
技术研发人员:尉建锋叶建统杨建光
申请(专利权)人:杭州卓健信息科技有限公司
类型:发明
国别省市:浙江;33

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1