Vue项目使用Webpack打包出现路径错误的解决问题


Vue打包碰到的一些问题,路径错误等问题。 在我们项目开发完成之后,使用npm run build对Vue项目进行打包。

打包后会出现一个dist文件夹,里面将我们的js、css、img等文件全部打包好了,并且生成了一个index.html文件。 我们打开index.html文件时发现我们的css或者js文件,再或者图片路径会报错不显示,甚至打开之后网页全是空白的,这个时候该怎样解决呢?

其实我们只需要配置一下文件的路径等就可以完美解决这个问题了。

在index.js中的build命令的配置有一个属性叫assetsPublicPath,它的值为‘/’。意思是根目录,这时会从index.html所在的硬盘的根目录下开始查找,自然无法找到。解决办法:

重新打包,即可解决图片找不到的问题。

声明:前端编程学习记录|版权所有,违者必究|如未注明,均为原创|本网站采用BY-NC-SA协议进行授权

转载:转载请注明原文链接 - Vue项目使用Webpack打包出现路径错误的解决问题


行路有良友,便是捷径。带上我吧,一起去看更大的世界。