主应用vite-vue3部署子应用也是vite-vue3，部署后没加载子应用

[Davide168]

问题描述

问题的具体描述 在未部署前主基座调子应用，没问题；部署后，部署后没加载子应用

复现步骤

1.# 相关配置 server { listen 8081; server_name http://192.168.0.29;

location / { root E:/nginx-1.26.1/html; index index.html;

add_header Cache-Control;

add_header Access-Control-Allow-Origin *;
if ( $request_uri ~* ^.+.(js|css|jpg|png|gif|tif|dpg|jpeg|eot|svg|ttf|woff|json|mp4|rmvb|rm|wmv|avi|3gp)$ ){
  add_header Cache-Control max-age=7776000;
  add_header Access-Control-Allow-Origin *;
}

} location /ruoyi_cloud_vue3_vite_ts { root E:/nginx-1.26.1/html;

# add_header Cache-Control;
add_header Access-Control-Allow-Origin *;
if ( $request_uri ~* ^.+.(js|css|jpg|png|gif|tif|dpg|jpeg|eot|svg|ttf|woff|json|mp4|rmvb|rm|wmv|avi|3gp)$ ){
  add_header Cache-Control max-age=7776000;
  add_header Access-Control-Allow-Origin *;
}
 try_files $uri $uri/ /ruoyi_cloud_vue3_vite_ts/index.html;

}

location /pro-api/{ proxy_set_header Host $http_host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://192.168.0.51:52001/; proxy_redirect off; } location /api/{ proxy_set_header Host $http_host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://192.168.0.51:50000/; proxy_redirect off; }

子应用

location /tsorder { root E:/nginx-1.26.1/html; add_header Access-Control-Allow-Origin ; if ( $request_uri ~ ^.+.(js|css|jpg|png|gif|tif|dpg|jpeg|eot|svg|ttf|woff|json|mp4|rmvb|rm|wmv|avi|3gp)$ ){ add_header Cache-Control max-age=7776000; add_header Access-Control-Allow-Origin *; } try_files $uri $uri/ /tsorder/index.html;

}

error_page 404 /404.html; location = /40x.html { }

error_page 500 502 503 504 /50x.html; location = /50x.html { } } 2.

3. { // 👇 非严格匹配，/my-page/ 都指向 MyPage 页面 path: '/tsorder/', // vue-router@4.x path的写法为：'/my-page/:page*' name: 'tsorder', hidden: false, component: order, meta: { title: '订单管理', icon: 'dashboard', affix: true } },

上传截图

请上传代码截图、控制台、终端等截图以帮助我们了解您的问题。

复现仓库

请提供一个精简的代码仓库，然后上传到自己的 github，以帮助我们复现您的问题。 https://gitee.com/david168/zxd-glm-web-demo.git的dev分支

环境信息

• micro-app版本：@micro-zoe/micro-app": "^1.0.0-rc.1"
• 主应用前端框架&版本：ruoyi-vite-ts "version": "0.0.0", "vue": "^3.2.45","vue-router": "^4.1.6"
• 子应用前端框架&版本：
• 构建工具&版本：

[bailicangdu]

这种情况一般是nginx配置问题，先单独打开子应用看能不能正常加载

[Davide168]

感谢，按照指导现在能出现页面，但是到子应用后，刷新报404

[bailicangdu]

还是nginx的配置问题，而且这个路由地址看起来不太正常