vue build 部署在tomcat后 css 与 js 404,无法找到

问题描述

vue build 后，生成的dist文件扔到 tomcat/webapp/（先清空文件夹） 下，可以改一下dist为项目名；

启动tomcat，前端输入 localhost:8080/project ，F12无法找到 css/js/png等静态资源。

探索

网上很多讲了解决方法，试了几个不行。有的也能提供思路。可能用的打包配置不一样吧。

思路

但根本的思路应该是：

查看dist文件夹中的index.html文件，找一个 css、js或png的链接，查看其引用路径是否正确；

是从根目录还是相对路径。如果是 vs code 等 IDE，还可按住 ctrl，点击资源链接，是否支持文件跳转，以验证路径是否正确。

根目录默认的是dist一级的整个项目目录，而不是dist内。相对路径就是dist/index.html同级的js、css、image文件夹了。

解决方式

在配置文件中，找到 publicPath 或其他形式的 打包路径，修改 ‘/’ 为 ‘./’。
当然，具体问题具体分析。这种404问题大部分是路径不对。