[发明专利]基于Nginx路由分发式的微前端系统及其开发、部署方法

权利要求书

1.一种基于Nginx路由分发式的微前端系统，其特征在于：包括若干相互独立的相同或不同的前端框架工程，所述的工程之间基于路由通过nginx进行应用跳转；所述前端框架工程包括前端angular框架工程和前端react框架工程；所述前端angular框架工程以angular框架为主体，使用history路由模式，以nodejs为运行环境，使用gulp为构建工具，以gitlab为存储环境，使用jenkins为发布工具；所述前端react框架工程以react框架为主体，使用hash路由模式，以nodejs为运行环境，使用webpack为构建工具，以gitlab为存储环境，使用jenkins为发布工具。

2.根据权利要求1所述的基于Nginx路由分发式的微前端系统，其特征在于：不同的前端工程同时使用history路由模式或hash路由模式，或者分别使用history路由模式和hash路由模式。

3.一种基于Nginx路由分发式的微前端系统的开发方法，其特征在于，包括以下步骤：

步骤A1：建立angular工程，用于提供angular运行环境，默认使用history路由模式，添加react工程的hash路由模式地址；

步骤A2:建立react工程，用于提供react运行环境，使用hash路由模式，添加angular工程的history路由模式地址，添加react工程的hash路由模式地址；

步骤A3:使用nginx反向代理工具，在开发域名配置下，添加angular工程路由和react工程路由的第一级路径名称做转发;

步骤A4:使用history或者hash路由模式，第一级路径命名如果都是唯一的，那么工程之间的位置无顺序要求，如果命名有相同的，那么优先使用的工程的位置需要在其他工程前面；

步骤A5:nginx判断当前访问的url路由，进而跳转对应工程。

4.一种基于Nginx路由分发式的微前端系统的部署方法，其特征在于，包括以下步骤：

步骤B1:在angular工程，使用gulp构建工具将静态资源打包成product文件夹，使用git提交到gitlab上，使用jenkins发布工具拉取gitlab相应分支代码，将打包文件更新推送到服务器域名对应工程路由文件夹中；

步骤B2:在react工程，使用git提交到gitlab上，使用jenkins发布工具拉取gitlab相应分支代码，通过配置命令将静态资源打包成build文件夹，打包成功后并更新推送到服务器域名对应工程路由文件夹中，打包失败则阻止并输出错误代码在jenkins上；

步骤B3:在访问域名的服务器上，使用nginx设置不同工程的路由转发，用于门户访问不同的前端应用。