vue上线后图片不显示_解决Vue打包后访问图片/图标不显示的问题

大家可否遇到过 npm run build打包后，项目在线上运行时，资源文件 (图片、图标)不显示的问题，

接下来，我给大家分享一下我的解决方案~

1.检查打包后dist中的css文件

打开此文件后你会头晕，因为都是打包压缩过的css代码，不过没关系，关键字搜索url

检查该url路径是否匹配正确

对比后惊人发现！！！

因此在url路径前添加../../就OK了，但是很麻烦，每次打包后都要进行二次加工吗？

并不是！！！

2.自动添加 ../../ 的方法

打开build/utils.js，检测 publicPath 值是否正确，自己配置成相应的即可！

if (options.extract) {

return ExtractTextPlugin.extract({

use: loaders,

fallback: 'vue-style-loader',

publicPath: '../../'

})

} else {

return ['vue-style-loader'].concat(loaders)

}

配置好之后，npm run build打包后就会自动匹配正确的路径，无需手动修改，

总结

以上所述是小编给大家介绍的解决Vue打包后访问图片/图标不显示的问题,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！

如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

vue上线后图片不显示_解决Vue打包后访问图片/图标不显示的问题相关推荐

vue 动态获取的图片路径不显示_解决Vue动态加载本地图片问题
最近遇到了个问题,用v-bind动态绑定img的src,图片加载不出来.控制台显示src是有获取到图片地址的,可是就是加载不出来. 最后才发现原因原来是浏览器中直接显示'./img/img1.png' ...
vue 组件第一次不渲染问题_解决vue页面渲染但dom没渲染的操作
我就废话不多说了,大家还是直接看代码吧~ this.$nextTick(() => { $("select[name='ddlCostCenter']").select2({ ...
vue 监听map数组变化_解决vue无法侦听数组及对象属性的变化问题
一.数组 1.可以监听到的情况如push.splice.=赋值(array=[1,2,3]) 2.无法监听到的情况使用下标修改某个元素(这种比较常见) array[index] = 1 objec ...
vue动态生成下拉框_解决vue动态下拉菜单有数据未反应的问题
问题出现在当时后台数据会返回到data中但是没有出现下拉菜单,查询资料发现 Vue的this理解有误 jsp 下拉菜单 {{item.plantModelName}} JS new Vue({ el ...
vue移动端点击事件延迟_解决Vue 界面在苹果手机上滑动点击事件等卡顿问题_莺语_前端开发者...
用 (1).滑动页面卡顿, (2).点击事件响应缓慢,百度才发现在苹果手机上有300ms的延迟. 一.滑动页面卡顿 //页面布局页面内容在对应的组件的最外层div上加上这样的样式: .conten ...
解决pyinstaller打包后的exe文件打开闪退的问题
解决pyinstaller打包后的exe文件打开闪退的问题闪退问题:一般我们打包完后的exe文件点击运行就会直接闪退,很难看到具体错误解决步骤: 首先打开 cmd 进入到 exe 文件所在目录(c ...
解决vue-cli 打包后静态资源路径不对的问题
解决vue-cli 打包后静态资源路径不对的问题参考文章: (1)解决vue-cli 打包后静态资源路径不对的问题 (2)https://www.cnblogs.com/sifo/p/1008399 ...
解决vue-pdf 打包后生成worker文件报错问题
解决vue-pdf 打包后生成worker文件报错问题安装 vue-pdf npm install --save vue-pdf 进入目录 node_modules/worker-loader/di ...
电脑开始关机待机重启出现计算机,电脑关机后进入待机状态如何解决电脑关机后自动开机怎么回事...
在日常使用电脑的时候,如果我们没有定时的清理和保养,难免会遇到一些电脑故障问题,近日很多电脑用户都遇到了电脑开机后进入待机状态的问题,这很可能是计算机命令执行错误引起的,那么该怎么办呢?其实方法很简单 ...

vue上线后图片不显示_解决Vue打包后访问图片/图标不显示的问题

vue上线后图片不显示_解决Vue打包后访问图片/图标不显示的问题相关推荐

最新文章

热门文章