基于微前端的数据处理方法、框架、存储介质及终端设备技术

技术编号:33072714 阅读:34 留言:0更新日期:2022-04-15 10:07
本申请实施例提供一种基于微前端的数据处理方法、框架、存储介质及终端设备,该方法包括:接收各子应用的定制信息,并将各子应用的定制信息发送至微前端主工程模块,根据定制信息生成各子应用对应的加载菜单和初始化文件;根据加载菜单加载各子应用对应的微前端子工程模块;将初始化文件发送至微前端子工程模块,根据初始化文件生成各子应用对应的主入口文件,数据状态集文件和内部样式文件,完成各子应用的部署操作。本申请实施例通过在整合多种前端技术栈的微前端子工程模块,并基于同一模块架构构建而成,使得多技术栈开发人员可以共同服务于同一个微前端平台业务系统,极大的提高了业务平台系统的技术兼容性。提高了业务平台系统的技术兼容性。提高了业务平台系统的技术兼容性。

【技术实现步骤摘要】
基于微前端的数据处理方法、框架、存储介质及终端设备


[0001]本申请涉及电子通信
,尤其涉及一种基于微前端的数据处理
,特别涉及一种基于微前端的数据处理方法、框架、存储介质及终端设备。

技术介绍

[0002]现代企业在数字化转型上加速进行,企业的软件工程体量越来越大,软件开发过程中前后端分离,后端的微服务化已经有行业较成熟的解决方案;前端工程采用React,Vue,Angular三个框架其一来构建单页应用是行业中的常规开发模式。随着业务的发展,一个前端工程包含了上百甚至更多的个业务模块,前端单页应用已成为一个单页巨石应用。传统的前端开发技术面临着如下的技术问题:巨石前端工程体量巨大,运维实施编译发布时间长,哪怕是一个文案的改动也需要整个工程重新编译,发布几个小时;每次发布都需要将前端单一工程编译增加发布分支,一个前端工程里包含了十几个项目,几乎每天都会有项目发布,发布分支冗余,常出现发布分支不对造成的错发漏发;代码耦合度高,通过分支管控,每个项目都会有十几个研发分支,十几个项目在一个工程每天会有分支冲突解决,需要大量时间成本,研发本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于微前端的数据处理方法,其特征在于,所述方法基于微前端的数据处理框架实现,所述微前端的数据处理框架包括:微前端主工程模块和至少两个不同类别的微前端子工程模块,所述至少两个不同类别的微前端子工程模块基于同一预设的模块架构构建而成,通过所述模块架构构建的微前端子工程模块能够生成主入口文件,数据状态集文件和内部样式文件;所述方法包括:接收各子应用的定制信息,并将所述各子应用的定制信息发送至所述微前端主工程模块,根据所述定制信息生成所述各子应用对应的加载菜单和初始化文件;根据所述加载菜单加载所述各子应用对应的微前端子工程模块;将所述初始化文件发送至所述微前端子工程模块,根据所述初始化文件生成各子应用对应的主入口文件,数据状态集文件和内部样式文件,完成各子应用的部署操作。2.如权利要求1所述的数据处理方法,其特征在于,所述模块架构包括:业务模块定义单元,用于定义生成对应不同功能的业务模块;内部样式定义单元,用于定义所述业务模块的内部样式,并生成对应不同业务模块的内部样式文件;数据状态定义单元,用于定义所述业务模块在不同节点的状态,并生成对应不同业务模块的数据状态文件;主入口文件生成单元,用于定义生成不同业务模块的主入口文件。3.如权利要求2所述的数据处理方法,其特征在于,所述内部样式文件包括CSS文件,所述方法还包括:分别定义JS文件和CSS文件的生命周期,所述生命周期至少包括加载事件与卸载事件,所述加载事件用于加载展示所述JS文件或CSS文件,所述卸载事件用于关闭停用所述JS文件或CSS文件。4.如权利要求1所述的数据处理方法,其特征在于,所述微前端主工程模块包括路由分发单元、第三方依赖映射配置单元、子应用入口路径配置单元、样式管理中心、消息分发中心及主工程基础前端单元;所述路由分发单元用于接收各子应用的定制信息,并将所述各子应用的定制信息发送至所述主工程基础前端单元;所述第三方依赖映射配置单元用于配置系统所使用到的第三方依赖库文件地址及对应别名的映射,以及在不同运行环境下的依赖集合切换;所述子应用入口路径配置单元用于配置各子应用在不同运行环境下的主入口文件和数据集文件的资源路径,以及各子应用的下的所有模块相关信息;所述样式管理中心用于配置系统相关内部样式和各子应用所依赖的第三方组件库样式,并在系统运行时控制样式版本切换;所述消息分发中心用于构建全局事件分发器,用于集合各子应用数据和数据修改时间的统一分发;所述主工程基础前端单元用于根据各子应用的定制信息生...

【专利技术属性】
技术研发人员:ꢀ七四专利代理机构
申请(专利权)人:TCL通讯科技成都有限公司
类型:发明
国别省市:

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

1