原文:vue webpack打包后.css文件里面的背景图片路径错误解决方法

资源相对引用路径 问题描述 一般情况下,通过webpack vuecli默认打包的css js等资源,路径都是绝对的。 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径,那么要解决这种问题,就得引用相对路径。 解决办法 打开webpack.prod.conf.js 找到output:增加publicPath: . , 即可,如图。 那么这样后,资 ...

2018-01-11 15:52 1 17710 推荐指数:

查看详情

vue图片路径,和背景图片路径打包错误解决

最近在研究vue,老实的按照官网提供的,搭建的了 webpack+vue+vuex+vue-router,,因为是自己搭建的,所以踩了不少坑,一般问题百度都有,这个背景图片的问题,查了很久才解决。 1、找到 config->index.js里面,如下修改 2、找到 build-> ...

Tue Dec 12 00:00:00 CST 2017 0 12901
Vue项目之背景图片打包路径错误

第一种方法: 原因: 首先,出错点在url-loader上面。 这里解释一下上面这段url-loader配置,test是正则匹配规则,匹配项目中所有的以正则规则结尾的格式的文件,直白点就是所以的图片(png,jpg,jpeg,gif,svg)。然后用url-loader进行处理。处理也有 ...

Fri Jun 09 00:22:00 CST 2017 0 7710
解决Vue打包背景图片路径错误问题

1.原因解析 当用vue-cli自动构建项目,有两种运行方法,分别是:   npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片。   npm run build : 打包项目,资源使用相对路径,所以会出现路径错误问题。 注: 绝对路径 ...

Thu Mar 22 21:30:00 CST 2018 0 7903
webpack配置-打包背景图片路径问题

问题 项目在开发环境下工作正常,当打包图片不见了,检查元素发现路径出错了。图片路径是这样:background: url(/static/img/bg_camera_tip.bd37151.png),但该路径文件并不存在。 打包文件目录如下: 可以看到背景图片路径应该是 ...

Wed Dec 05 23:45:00 CST 2018 0 936
vue项目打包资源相对引用路径的和背景图片路径问题

vue项目中若要使用相对路径来获得相应静态资源, 在一般项目 build 之后都会生成一个 index.htm 文件和 一个 static 文件夹,而 static 这个文件夹需要被放置在根目录下, 1.需要找到config --- index.js(webpack 是依据index.js ...

Tue Dec 18 19:20:00 CST 2018 0 2927
Vue项目打包发布CSS中的背景图片不显示

相信有很多同学在学习vue的刚开始都遇到过项目打包发布发现CSS中的背景图片不显示,具体如何解决只需要更改bind的配置即可 修改 build/utils.js 中的 generateLoaders 方法,如下代码,增加 publicPath: '…/…/' ...

Mon Jul 01 18:34:00 CST 2019 0 1052
vue打包CSS中引用的背景图片不显示问题

vue项目中,在css样式中引用了一张背景图片,开发环境下是可以正常显示,build之后背景图片不显示。 解决方法: 找到build/utils.js文件 修改成为如下所示内容: 添加红框中的内容即可。 ...

Thu Nov 22 23:37:00 CST 2018 0 852
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM