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

vue打包后CSS中引用的背景图片不显示问题的更多相关文章

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

    资源相对引用路径 问题描述 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的. 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static ...

  2. vue打包后css背景图片地址找不到

    背景图片变成了这样:static/css/static/imgs/xxx.jpg 解决方法,修改build/utils,添加   publicPath: '../../'    就行 对比了下,com ...

  3. background属性冲突导致的部分浏览器背景图片不显示问题

    前几天在项目中遇到了一个让人摸不着头脑的bug,测试说页面显示有点问题并发了截图, 正常的显示状态是这样 首先我自信地用自己的手机检查了一下,没有问题,问清楚后得知是UC浏览器中出现的,UC的内核是u ...

  4. Vue项目打包发布后CSS中的背景图片不显示

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

  5. vue打包后js和css、图片不显示，引用的字体找不到问题

    vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...

  6. vue build打包后css里的图片路径404不正确的问题

    vue build打包后css里的图片路径404 在vue-cli项目中build/utils.js中找到如下代码块,添加 publicPath:’../../’ if (options.extrac ...

  7. vue打包后空白页问题全记录 （background路径，css js404，jsonp等）；

    总结一下vue打包后问题全记录:大部分开发者webpack基本上都是拿来就用的(并没有系统化的研究). 一 >>> 打包之后的静态文件不能直接访问:(例如dist)打包后搭个服务器才 ...

  8. 关于vue打包后，访问不到页面和访问不到图片。

    vue项目完成打包上线的时候很多人都会碰到静态资源找不到,常见的有两个第一种:js,css路径不对解决办法:打开config/index.js,将其中的assetsPublicPath值改为’./’ ...

  9. vue打包后显示空白正确处理方法

    vue打包后显示空白正确处理方法是 1.找到配置文件(js与css加载不上) 修改 这样打包处理可以打开但是页面样式会找不到 2.修改(针对css中的图片加载不上) 找到对应的位置加上publicPa ...

随机推荐

  1. JDK的详细安装步骤

    jdk的安装 一.下载jdk安装包,可以从https://www.cnblogs.com/zyx110/p/10799387.html中查找并下载 二.双击打开jdk安装包,一路傻瓜式安装,点击下一步 ...

  2. django组件之中间件

    中间件的概念 中间件顾名思义,是介于request与response处理之间的一道处理过程,相对比较轻量级,并且在全局上改变django的输入与输出.因为改变的是全局,所以需要谨慎实用,用不好会影响到 ...

  3. 修改阿里云ESC Centos 7.4 防火墙开放端口

    例如系统:Centos 7.4操作如下 1,进入 cd /etc/firewalld/zones/ 目录 2,编辑 vim public.xml 3,按i或insert键进入编辑模式 4,在<z ...

  4. 搭建 Django 平台

    1.使用Pycharm.创建一个Django项目 2.图示 3.在终端输入: 4.结果

  5. delphi 与 java 兼容的 MD5

    function GetMd5(AValue : string) : string; var md5 : TIdHashMessageDigest5; bytes,byte1 : TBytes; be ...

  6. The 'gridview' module MUST be setup in your Yii configuration file.

    解决方法:common的config的main.php中添加 'gridview' => ['class' => 'kartik\grid\Module'], 在vender的compos ...

  7. web前端开发道路

    https://github.com/z-jingjie/developer-roadmap-zh-CN

  8. idea进行断点快捷键

    快捷键 功能描述 F8 单步调试,不进入函数内部 F7 单步调试,进入函数内部 Shift+F7 选择要进入的函数 Shift+F8 跳出函数 Alt+F9 运行到断点 Alt+F8 执行表达式查看结 ...

  9. JS你可能还不知道的一些知识点（一）

    js程序是用Unicode字符集编写的, 2.转义字符:反斜线 1 2 3 4 function Test(){   var s='you\'re right,it can\'t be a quote ...

  10. C# 通过 Hessian服务调用java

    1.下载Hessiancsharp.dll 2.新建一个c#窗体程序,然后在添加一个类库 3.添加一个接口类,接口中的方法名和参数与java中的服务方法名和参数保持一致 public partial ...