webpack 打包后文件路径有误 assetsPublicPath 配置

问题描述

打包后的文件，部署到线上的时候，报 404 问题，如下图所示：

找不到相关文件

问题解决

第一反应，就是 webpack 的打包路径有什么题了。

目前的链接

http://mcp-admin-test.vip.vip.com/static/css/app.c87e17c7.css

尝试了一下,发现下面是可以访问的

http://mcp-admin-test.vip.vip.com/web/dist/static/css/app.c87e17c7.css

好的，那就是需要再配一下 web/dist/

那么在哪里配置呢?

发现在 config/index.js 目录下，有以下的介绍和配置项

 /**
     * You can set by youself according to actual condition
     * You will need to set this if you plan to deploy your site under a sub path,
     * for example GitHub pages. If you plan to deploy your site to https://foo.github.io/bar/,
     * then assetsPublicPath should be set to "/bar/".
     * In most cases please use '/' !!!
     */
       

 assetsPublicPath: '/'

是的，这里默认就是 /, 如果你部署的时候有特殊情况的话，就需要自己改，比较明显自己就是这里有问题。
改成以下：

 assetsPublicPath: '/web/dist/'

问题解决！

参考文章：
vue项目之webpack打包静态资源路径不准确