vue项目打包到服务器，背景图片出现404
打包之后会把图片变成base64格式，但是如果所有图片包括一些比较大的图片都转的话，反而会浪费资源，因此在build/webpack.base.conf.js里面可以配置图片格式转换的限制大小， 可知生成图片的地址配置是在util.js中，所以在build中找到util.js文件，添加 ...
原文：vue项目打包部署服务器后无法访问背景图片问题处理方法
如果项目原来运行正常，只是添加了背景图之后背景图片无法正常显示，那么可以先查看元素，看下背景图片路径变成什么样了。 一般应该是如下这样： 这就造成了图片路径错误而无法正常加载，这个就需要对打包配置项进行调整了，如下： 即添加publicPath: .. .. 即可。 另外，打包之后，在本地直接访问index.html文件，添加了背景图片的页面如果可以直接访问，那么这个背景图片应该就可以直接展示了： ...
2021-08-05 17:41 0 121 推荐指数：
相关推荐
在Vue项目中，添加的背景图片在服务器上不显示，如何处理
遇到的问题： 在vue项目开发过程中，我们常常会在页面中添加背景图片。可是当我们在样式中添加了背景图片，编译打包部署到服务器上时，发现图片并不能显示出来，这是为什么呢~~~ 我们一般写的css样式如下： 问题原因： 因为在编译打包后，图片的路径解析出现了问题。 解决方法 ...
vue项目打包后资源相对引用路径的和背景图片路径问题
vue项目中若要使用相对路径来获得相应静态资源， 在一般项目 build 之后都会生成一个 index.htm 文件和 一个 static 文件夹,而 static 这个文件夹需要被放置在根目录下, 1.需要找到config --- index.js(webpack 是依据index.js ...
vue代码上传服务器后背景图片404解决方法
问题：代码上传服务器后，图片404，使用的font-awesome图标也是404 解决办法： 如果你用了vue-cil，那么在build目录下找到utils.js中的ExtractTextPlugin.extract({}),里面添加下面这个属性就完美解决了publicPath ...
vue-cli 3.0 创建的项目，打包后在服务器无法访问，或是访问呈一片空白
vue-lic3.0默认不会自动创建vue.config.js文件，所以我们需要手动在目录下创建一个（和package.json,README.md等文件同级） vue.config.js的内容： module.exports = { //... baseUrl ...
vue打包之后，部署到nginx无法显示背景图片，502
最近在开发过程中遇到这种问题，在vue打包完成之后，本地启动可以正常运行的项目，一旦部署到nginx之后，css中的background:url(XXX)的图片直接502。 我的图片是放在/assert路径下： 经过研究之后，发现这样的话，webpack会将图片作为静态文件打包 ...
Vue项目打包发布后CSS中的背景图片不显示
相信有很多同学在学习vue的刚开始都遇到过项目打包发布后发现CSS中的背景图片不显示，具体如何解决只需要更改bind的配置即可 修改 build/utils.js 中的 generateLoaders 方法，如下代码，增加 publicPath: '…/…/' ...
Vue项目之背景图片打包后路径错误
第一种方法： 原因: 首先，出错点在url-loader上面。 这里解释一下上面这段url-loader配置，test是正则匹配规则，匹配项目中所有的以正则规则结尾的格式的文件，直白点就是所以的图片（png，jpg，jpeg，gif，svg）。然后用url-loader进行处理。处理也有 ...