[发明专利]一种多平台小程序及H5页面适配的方法及系统

说明书

一种基于小程序语法实现多平台小程序及H5应用适配的系统，包括：gaea配置模块、gaea解析器模块和gaea编译器模块；所属gaea配置模块用于构建整个项目源码编译过程；所属gaea解析器模块用于扫描根路径下所有的文件，系统是基于webpack打包工具的loader和plugin机制，实现编译构建生成多个平台小程序源码的；gaea编译配置是整个编译流程控制的配置文件，获取整个源码文件资源；gaea解析器是构建文件之间依赖关系以及编入gaea运行环境的单元，通过该解析器，扫描项目根目录下所有文件，解析各个文件模块之间的依赖关系；gaea编译器，将js文件编译为各个平台小程序和H5应用源码。

技术领域

本发明属于移动前端多平台适配技术领域，具体涉及一种对于多平台小程序及移动端H5页面适配的方法及系统，解决针对多个平台小程序和移动端H5页面需要实现多套前端源码的问题。

背景技术

近些年来，随着移动互联网和终端设备的飞速发展，用户逐渐从电脑端转移到移动端，据中国互联网络信息中心(CNNIC)完成的第44次《中国互联网络发展状况统计报告》中统计，截止2019年6月，中国移动互联网用户达到8.47亿。面对一个迅速走向移动化的世界，我们需要更多基于移动端的应用解决方案，来获得更多的流量，迅速的抢占用户市场。但是移动终端设备多种多样，不仅有不同的操作系统，更有不同的手机浏览器和屏幕尺寸，所以在开发移动端应用时，不仅要开发基于浏览器端访问的H5应用，还要针对iOS和Andriod系统开发体验性更好的原生应用或者混合应用，这对于研发来说，需要招聘更多不同方向的开发者，承担更多的人力成本，开发周期也会变得更长，与此同时，开发者为应对不同的系统，还需要花费更多的精力，进行各种适配调优，来提升用户使用体验。

面对以上的开发效率问题和各种用户体验问题，国内各大流量入口，微信、支付宝、百度、头条、QQ等都基于自己的平台开发出了各自的小程序。这对于我们来说，虽然不再需要花费大量的人力和精力去适配优化各终端，就可以有效提升用户的使用体验，但是开发效率问题并未解决，因为如果我们希望在各大流量入口都有自己的应用，获取到更多的流量，就需要遵循每个平台的小程序语言规范和开发方式开发一套小程序源码，无法做到只用写一套源码，就可以生成多平台运行的源码，所以开发效率并未降低，反而可能由于更多的流量入口开发自己的小程序，导致我们的开发量增多。

如微信小程序和支付宝小程序为例：小程序兴起，很多传统的网站、APP的功能被迁移到小程序上，如果想要在两个平台上都发布自己的小程序应用，就需要分别开发两份小程序源码，因为两个小程序语法和规范不一样，源码不可通用。

面对开发者需要针对不同的平台开发多套应用源码的问题，市面上也出现了一些解决方案和技术，比如基于React框架的taro、基于Vue框架的uni-app等，这对于一个会使用React或者Vue的开发者来说能够做到开发一套(React或Vue应用)源码编译后，生成多个平台的小程序源码运行，是一种很不错的解决方案。但是对于更多不会使用这两种框架语法的开发者来说，问题还是无法解决，除非他们先去从头开始学习并能够熟练使用React或者Vue框架语法中的任意一个，那么开发者就需要承担更多的学习和时间的成本。

术语解释，H5：指第5代HTML，也指用H5语言制作的一切数字产品。所谓HTML是“超文本标记语言”的英文缩写。“超文本”是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素，而“标记”指的是这些超文本必须由包含属性的开头与结尾标志来标记。上网所看到的网页，多数都是由HTML写成。它是一种高级网页开发技术，它不是一种标记语言，为下一代web提供了全新的框架和平台，包括提供免插件的音视频、图像动画、本体存储以及更多重要的功能。相比H4，H5有更多的交互和功能，并且支持在移动设备上支持多媒体。H5的应用很广泛，基于H5有很多产品载体，比如PPT、APP等。

发明内容