vue 路由分发式微前端项目部署

例: 主项目地址为: http://xxx.com, 想配置 xxx.com/newproject  为另一个项目

1. 修改 vue.config.js 中的publicPath (publicPath: '/newproject') // 新项目的静态资源打包路径, 如访问 xxx.com/newproject 查看 network 所有静态资源路径前没有 /newproject 可能这里忘记配置

2. 修改 vue-router 中的 base (base: '/newproject') // 项目路由匹配的前缀

3. 修改 newproject 项目的 nginx 配置 (使用 nginx 的 docker)

location /newproject {

    alias /var/www/;

    index index.html index.htm;

    try_files $uri $uri/ /newproject/index.html; # (重要)

}

4. 修改 nginx 主入口配置 (负载均衡相关, 可选)

upstream newproject {

    server xx.xx.xx.xx weight=1; # (xx.xx.xx.xx 为 newproject 的地址)

}

location /newproject {

    proxy_pass http://newproject;

    #proxy 相关配置;

}