Vue打包后静态资源路径错误

vue项目打包完了,dist文件也生成了,运行一下,又报错了

错误还不少,报了好多资源路径找不到的错误,大概有两种

  • 一种是js或css文件引入路径错误,找不到文件
  • 一种是css中的图片路径错误,找不到图片

#############################################

  • js或css文件引入路径错误解决办法如下:

不知道大家发现没有,所有的路径错误都是少了个点,例如:

src=/static/js/app.5d7099352641a1a9dd32.js

知道原因了就找解决办法,手动加也行,不过为了每次打包完即用

在配置文件里改,一劳永逸

找到config/index.js 配置文件,找build打包对象里的assetsPublicPath属性

默认值为/,更改为./就好了

20190401001.png
  • css中的图片路径错误,找不到图片解决如下

在css里引入图片路径打包的时候路径会错

打开build/utils.js文件,把打包css文件的配置加一个打包路径即可

加一行代码,如下

20190401002.png

如果对您有用,请点个赞或关注下!谢谢

原创,转载请注明出处!

投诉建议邮箱:214930661@qq.com

GitHub:https://github.com/isboyjc

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 写在开头 先说说为什么要写这篇文章, 最初的原因是组里的小朋友们看了webpack文档后, 表情都是这样的: (摘...
    Lefter阅读 10,711评论 4 31
  • 版权声明:本文为博主原创文章,未经博主允许不得转载。 webpack介绍和使用 一、webpack介绍 1、由来 ...
    it筱竹阅读 13,864评论 0 21
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,415评论 1 45
  • 在现在的前端开发中,前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等等一些原本后端的思想开始...
    Charlot阅读 10,869评论 1 32
  • 关于Vue打包发布的问题 项目完成之后,发现打包发布以后,在wamp配置完成以后,访问首页和主题页都没有问题,当进...
    working_Poor阅读 8,884评论 0 0

友情链接更多精彩内容