找到config文件夹下的index.js文件修改一下位置

看清楚是 build（上边还有个dev 是开发环境下的配置，不需要改动）下的 assetsPublicPath ：将‘/’改为‘./’

在css中写的background-img的路径出错 需要找到build文件夹下的utils.js,修改一下位置

最后，重新npm run build一下，就可以访问成功！

vue打包空白，图片没加载，背景颜色没有渲染出来-配置秘诀的更多相关文章

  1. Vue实现一个图片懒加载插件（转载）

    Vue是可以自定义指令的,最近学习过程中遇见了一个需要图片懒加载的功能,最后参考了别人的代码和思路自己重新写了一遍.以下将详细介绍如何实现自定义指令v-lazyload. 先看如何使用这个指令: &l ...

  2. vue + vue-lazyload 实现图片懒加载

    1.安装 npm i vue-lazyload -S 2.配置 main.js /***图片模板等懒加载 start ***/ import VueLazyload from 'vue-lazyloa ...

  3. Vue中图片的加载方式

    一.前言 VUE项目中图片的加载是必须的,那么vue中图片的加载方式有哪些呢,今天博主就抽点时间来为大家大概地捋一捋. 二.图片的加载方法 1.在本地加载图片(静态加载) 图片存放assets文件夹中 ...

  4. [jQuery插件]手写一个图片懒加载实现

    教你做图片懒加载插件 那一年 那一年,我还年轻 刚接手一个ASP.NET MVC 的 web 项目, (C#/jQuery/Bootstrap) 并没有做 web 的经验,没有预留学习时间, (作为项 ...

  5. vue图片预加载

    目的: 图片预加载能够使得用户在浏览后续页面的时候,不会出现图片加载一半导致浏览不流畅的情况. 一.方法一 项目打开的时候要对图片进行预加载,在App.vue里面的beforeCreate添加预加载程 ...

  6. Vue 自定义图片懒加载指令v-lazyload

    Vue是可以自定义指令的,最近学习过程中遇见了一个需要图片懒加载的功能,最后参考了别人的代码和思路自己重新写了一遍.以下将详细介绍如何实现自定义指令v-lazyload. 先看如何使用这个指令: &l ...

  7. Vue图片懒加载

    图片懒加载的原理 先将img标签中的src链接设为同一张图片(空白图片),将其真正的图片地址存储再img标签的自定义属性中(比如data-src).当js监听到该图片元素进入可视窗口时,即将自定义属性 ...

  8. Vue图片懒加载之lazyload插件使用

    当内容没有加载完的时候,用户体验不是很好,这时候,可以使用lazyload这个插件,提升用户体验,使用方法特别简单易用 一. vue lazyload插件: 插件地址:https://github.c ...

  9. Vue图片懒加载插件

    图片懒加载是一个很常用的功能,特别是一些电商平台,这对性能优化至关重要.今天就用vue来实现一个图片懒加载的插件. 这篇博客采用"三步走"战略--Vue.use().Vue.dir ...

随机推荐

  1. 36个Android开发常用代码片段

    //36个Android开发常用代码片段 //拨打电话 public static void call(Context context, String phoneNumber) { context.s ...

  2. 解决 windows10 system service exception蓝屏

    解决方法: WINDOWS/system32/config/RegBack/SYSTEM/* 复制到 WINDOWS/system32/config/*下

  3. Unity 添加自定义菜单（插件），添加功能

    网上介绍如何写这种插件的文章很多...但是对于新手来说,最基本的,怎么运行这个插件,都不知道...网上的文章都懒得说这个...   幸好,看了半天官方网站别的资料,突然就发现办法了...   这个不是 ...

  4. poj 2226 二分图 最小点覆盖 , 最大流

    题目就是问怎样用最小的板覆盖全部的草地.能够横着放.也能够竖着放,同意一个草地放多个点. 建图方法就是 每一个横向的草地作为X,纵向连续的草地作为Y.     X连接Y的边表示,  这里有他们的公共点 ...

  5. MySQL存储过程中的3种循环【转载】

    在MySQL存储过程的语句中有三个标准的循环方式:WHILE循环,LOOP循环以及REPEAT循环.还有一种非标准的循环方式:GOTO,不过这种循环方式最好别用,很容易引起程序的混乱,在这里就不错具体 ...

  6. laravel5.4中{{$name}} 和 {{!! $name !!}} 的区别：后者原生输出。前者转义

  7. 在win7/8下搭建简易的无线平台

    资料:http://www.cnblogs.com/KeenLeung/p/3482073.html http://www.cnblogs.com/KeenLeung/p/3481998.html 其 ...

  8. 解释一下文件/etc/fstab的内容

    /etc/fstab 内容解释(偷个懒,把别人的话拷贝过来,做个标记,然后下班走人...)/dev/hda1 /mnt/c ntfs ro,users,gid=users,umask=0002,nls ...

  9. HDUOJ-----2571跳舞毯

    跳舞毯 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submiss ...

  10. 【ASP.NET Web API教程】2.4 创建Web API的帮助页面[转]

    注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本博客文章,请先看前面的内容. 2.4 Creating a Help Page for a Web API2.4 创建W ...