vite是居于ES6模块化的,打包后无法通过file://协议运行(vue cli可以直接本地跑),也就是说打包后无法直接打开index.html,需要基于静态文件服务器才能跑。不过我们也不存在本地跑的情况,要么线上环境开一个nginx跑,要么基于tomcat等服务器来跑。这里为了方便我直接放到SpringBoot项目,跟后端代码共用一个服务器来运行:

1.vite打包

为了打包后的文件可以导航,在vite.config.js文件中配置一下:base:'./',否则会出现空白页。

2.在SpringBoot项目的资源文件夹resources中新建static文件夹,然后把disk里面的文件复制到static文件夹中

3.配置静态文件映射:修改application.yml

spring:
  web:
    resources:
      static-locations: classpath:/static/

 4.启动SpringBoot项目,访问启动端口即可访问index.html。

出现问题的同学可以参考这篇实战使用SpringBoot替代Nginx发布Vue3项目-CSDN博客

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐