[发明专利]微前端方案实现方法及装置

说明书

本发明提供了微前端方案实现方法及装置，方法包括：接收方案的功能实现请求确定实现该功能子工程的节点路由信息；根据所述的节点路由信息和预先存储的节点清单确定实现该请求的子工程节点信息；其中，所述的节点清单为预先建立的节点路由与子节点工程信息的对应关系；根据确定的子工程节点信息将子工程注册至主工程的Vue实例以实现方案。本发明根据功能实现请求的节点路由信息和预先存储的节点清单确定实现该请求的子工程节点信息，将子工程注册至主工程的Vue实例以实现方案，提供一种基于Vue的微前端解决方案，实现在开发阶段各工程间彻底解耦、独立开发，做到单页应用体验。

技术领域

本发明涉及前端开发技术，具体的讲是一种微前端方案实现方法及装置。

背景技术

随着近几年前端领域相关技术的快速发展，前端的工程化程度急速提高，目前单页应用(SPA)成为前端开发的主流选择。但随着项目内容增多，前端工程体量也随之增长，带来的维护问题越来越突出，业界顺着微服务的思路提出了微前端的概念。微前端是一种利用微件拆分来达到工程拆分治理的方案，可以解决工程膨胀、开发维护困难等问题。

随着前端业务场景越来越复杂，微前端的概念被越来越多的提起，业界也有多种方案，针对不同的场景，有着不同的处理方案，现有技术的微前端解决方案存在诸多问题，需要一套能够做到在开发和部署阶段分离，又能够在运行时保证单页应用体验的微前端解决方案。

发明内容

为满足微前端开发的要求，解决现有技术的至少一问题，本发明提供了一种微前端方案实现方法，包括：

接收方案的功能实现请求确定实现该功能子工程的节点路由信息；

根据所述的节点路由信息和预先存储的节点清单确定实现该请求的子工程节点信息；其中，所述的节点清单为预先建立的节点路由与子节点工程信息的对应关系；

根据确定的子工程节点信息将子工程注册至主工程的Vue实例以实现方案。

本发明实施例中，所述的子工程节点信息还包括：子工程的节点入口、子工程静态文件；其中，

所述的子工程静态文件包括：路由信息、全局状态信息及多语言配置信息。

本发明实施例中，所述的根据确定的子工程节点信息将子工程注册至主工程的Vue实例以实现方案包括：

解析所述的子工程静态文件确定子工程的路由信息、全局状态信息及多语言配置信息；

根据所述的子工程的节点入口利用Vue插件加载所述的路由信息、全局状态信息及多语言配置信息子工程注册至主工程的Vue实例以实现方案。

本发明实施例中，所述的Vue插件包括：Vue-router插件、Vuex插件及Vue-i18n插件。

同时，本发明还提供一种微前端方案实现装置，包括：

请求接收模块，用于接收方案的功能实现请求确定实现该功能子工程的节点路由信息；

子工程节点确定模块，用于根据所述的节点路由信息和预先存储的节点清单确定实现该请求的子工程节点信息；其中，所述的节点清单为预先建立的节点路由与子节点工程信息的对应关系；

子工程注册模块，用于根据确定的子工程节点信息将子工程注册至主工程的Vue实例以实现方案。

本发明实施例中，所述的子工程注册模块包括：

解析单元，用于解析所述的子工程静态文件确定子工程的路由信息、全局状态信息及多语言配置信息；

注册加载单元，用于根据所述的子工程的节点入口利用Vue插件加载所述的路由信息、全局状态信息及多语言配置信息子工程注册至主工程的Vue实例以实现方案。