Vue打包部署到Tomcat服务器-白红宇的个人博客

Vue打包部署到Tomcat服务器

发布日期：2021-05-08 03:02:50 浏览次数：24 分类：精选文章

本文共 423 字，大约阅读时间需要 1 分钟。

我使用的是Vue-cli(simple)脚手架，目录结构更为简洁。

修改相关的配置，避免部署后常出现的空白页问题，而引起这个问题的根本原因是资源路径问题：

1.一个是index.html中的build.js路径问题；

2.一个是dist中静态资源路径问题。

加.，将绝对路径改为相对路径。

同样加.，改为相对路径。

在控制台运行npm run build命令开始对项目进行打包，打包后生成dist目录。

新建一个项目目录如：pahms，将新生成的dist目录和原项目文件中的index.html复制到pahms目录中，然后再将pahms目录放到tomcat的webapps目录下启动即可。

在打包过程中最容易出现的问题就是路径问题，如果页面显示异常，可以打开浏览器的开发者调试工具，通过network查看加载失败的资源路径具体是怎样的，然后自己做出相应调整即可。

上一篇：格式化Mybatis返回的Date时间

关于作者

喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！

-- 愿君每日到此一游！