vue 微前端 用nginx 发布流程总结（qiankun）

vue 微前端 用nginx 发布流程总结（qiankun）

---

什么是微前端

微前端架构具备以下几个核心价值：

1、技术栈无关
主框架不限制接入应用的技术栈，微应用具备完全自主权

2、独立开发、独立部署
微应用仓库独立，前后端可独立开发，部署完成后主框架自动完成同步更新

3、增量升级
在面对各种复杂场景时，我们通常很难对一个已经存在的系统做全量的技术栈升级或重构，而微前端是一种非常好的实施渐进式重构的手段和策略

4、独立运行时
每个微应用之间状态隔离，运行时状态不共享

---

一、vue微前端主应用配置地址

vue微前端配置地址：

 name: 'appone',//微应用名字
 entry: '//127.0.0.1:1800/appone/', // 微前端访问地址
 container: '#appone-container', // 挂载的主应用ID
 activeRule: '#/appone/app' // 微前端匹配的公共路由地址

二、vue微前端微应用配置注意事项

vue微前端微应用配置注意事项：
提示：需要改vue.config.js vue的配置文件

module.exports = {
   
    publicPath: 'appone' // 需要添加publicPath  否则微应用 index.html 里面的 js/css 路径不会带上 /app1/
}

三、nginx配置 微服务appone

微服务appone appone.conf：

server {
   
        listen