Vue打包發佈用tomcat運行起來後無法訪問，出現空白頁問題的解決方案

現象

使用npm run build發佈打包vue前端項目http://localhost:8080/xxx （webapps下的發佈的文件夾名）出現空白頁，使用F12查看如下圖：

原因

由於webpack打包引入css js等文件路徑爲絕對路徑，因此導致tomcat等web server相對路徑訪問不到而出現空白頁和ERR_ABORTED錯誤。

解決

1.在build/webpack.prod.conf.js中增加publicPath:'./'如下圖

注意：筆者本人只是修改了第1條，就打包後就可以進行正常訪問了。

如果還不能正常訪問可以試試2,3，至於更深層次的原因還沒有深入研究。

2.修改config/index.js將assetsPublicPath值改爲./

3.build/util.js中增加publicPath:'../../'，