一种可快速扩展的微前端实现方法及可快速扩展的微前端框架技术

本发明专利技术公开了一种可快速扩展的微前端实现方法及可快速扩展的微前端框架，属于通信运营商运维技术领域，基于VUE建立微前端框架，包括主应用App和子应用SubApp，所述主应用App内封装公共依赖、公共配置、公共插件、公共服务、公共数据、公共鉴权和校验、公共资源、公共组件以及公共路由，主应用通过中心化路由加载执行子应用；所述子应用SubApp内安装个性化组件，子应用剔除所有公共代码，作为纯业务代码的容器被主应用在运行时加载执行；通过主应用，根据权限系统动态加载子应用。本发明专利技术能够释放人力，降低人工成本，并有效提高运营商网络管理系统搭建和开发的效率，实现快速交付产品的微前端框架。前端框架。前端框架。

【技术实现步骤摘要】
一种可快速扩展的微前端实现方法及可快速扩展的微前端框架


[0001]本专利技术涉及通信运营商运维
，具体地说是一种可快速扩展的微前端实现方法及可快速扩展的微前端框架。

技术介绍

[0002]在通信运营商开发中后台应用中，由于是通信领域，其网络管理系统十分庞杂，用户不同的网管系统既有共性也有个性，在长期的开发维护中，随着项目越来越多，暴露的问题也越专利技术显：项目开发周期长，已有功能不能直接复用，项目个数跟维护成本成正比，公共代码的更新需要手工维护并重新构建所有项目。

技术实现思路

[0003]本专利技术的技术任务是针对以上不足之处，提供一种可快速扩展的微前端实现方法及可快速扩展的微前端框架，能够释放人力，降低人工成本，并有效提高运营商网络管理系统搭建和开发的效率。
[0004]本专利技术解决其技术问题所采用的技术方案是：
[0005]一种可快速扩展的微前端实现方法，基于VUE建立微前端框架，包括主应用App和子应用SubApp，
[0006]所述主应用App内封装公共依赖、公共配置、公共插件、公共服本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种可快速扩展的微前端实现方法，其特征在于，基于VUE建立微前端框架，包括主应用App和子应用SubApp，所述主应用App内封装公共依赖、公共配置、公共插件、公共服务、公共数据、公共鉴权和校验、公共资源、公共组件以及公共路由，主应用通过中心化路由加载执行子应用；所述子应用SubApp内安装个性化组件，子应用剔除所有公共代码，作为纯业务代码的容器被主应用在运行时加载执行；通过主应用，根据权限系统动态加载子应用：项目启动后，主应用会根据URL的第一个路径，动态匹配子应用程序，主应用在中心路径加载子应用的vue
‑
router和vuex，把以上内容加载到全局的vue框架内，之后定位到当前url地址对应的页面，将该页面打开。2.根据权利要求1所述的一种可快速扩展的微前端实现方法，其特征在于，所述主应用App内封装的公共依赖，包括vue，vue
‑
router，vuex；在开发环境下，在项目中使用UMD引入公共依赖，同时维护一份公共的Webpack externals配置，避免主应用和各个子应用在打包时重复构建公共依赖。3.根据权利要求2所述的一种可快速扩展的微前端实现方法，其特征在于，所述主应用App内封装的公共配置包括Webpack配置、App配置；公共插件包括Element
‑
UI，ag
‑
grid，echart；公共服务包括Utils，Http，Socket，Storage；公共数据包括Auth，Config，Message；Vuex modules，通过Vuex实现全局Store共享。4.根据权利要求1或2或3所述的一种可快速扩展的微前端实现方法，其特征在于，所述主应用App内封装的公共鉴权和校验，包括路由权限校验、用户角色校验。5.根据权利要求4所述的一种可快速扩展的微前端实现方法，其特征在于，所述主应用App内封装的公共资源包括样式、字体、图标、图片、Theme变量；公共组件包括<AlarmControl/>、<CompareControl/>；公共路由包括/index，/404。6.根据权利要求5所述的一种可快速扩展的微前端实现方法，其特征在于，在开发环境下，将子应用的入口设置为主应用，兼容主应用的公共配置，将devServer的contentBase也设置为主运行时的pub...

【专利技术属性】
技术研发人员：刘瑞伟，
申请(专利权)人：浪潮通信信息系统有限公司，
类型：发明
国别省市：