build 下的utils.js中添加配置

if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
publicPath: '../../',//配置背景图片打包后路径出错问题
fallback: 'vue-style-loader'
})
} else {
return ['vue-style-loader'].concat(loaders)
}

打包后发现一部分背景图片还是没显示出来。后来找到一个规律:凡是行内样式中写的style:background的背景图片都没出来,

解决方法:将style样式写到css中,打包后图片显示正确。理由暂不清楚。

vue上线后,背景图片路径错误的更多相关文章

  1. 解决Vue打包后背景图片路径错误问题

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

  2. Vue项目开发之打包后背景图片路径错误的坑

    在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...

  3. Vue项目打包后背景图片路径错误

    vue项目打包之后背景图片出错的解决方案如下: 1,找到 config->index.js里面,如下修改 默认配置: env: require('./prod.env'), index: pat ...

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

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

  5. vue项目打包后资源相对引用路径的和背景图片路径问题

    vue项目中若要使用相对路径来获得相应静态资源,需要修改以下内容来确保项目打包后能正常运行. 1.修改config => index.js => build => assetsPub ...

  6. vue+webpack项目打包后背景图片加载不出来问题解决

    在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...

  7. vue图片、背景图片路径问题

    vue图片.背景图片路径问题 vue中引入图片经常会出现路径问题,在此记录一下: 1.组件中 <img> 引用图片 <img src="../assets/img/logo ...

  8. webpack学习笔记——打包后直接访问页面,图片路径错误

    我说的这种图片路径错误是这样的,运行webpack-dev-server,一切正常,没有错误.当webpack之后,直接打开index页面,报错,图片找不到,找不到的原因是路径错误. 先看我的项目代码 ...

  9. vue 打包的项目当背景图路径错误

    当背景图路径错误时: 在build/utils.js中添加或更改这句话:publicPath: '../../',

随机推荐

  1. 【SpringBoot】搜索框架ElasticSearch介绍和整合SpringBoot

    ========================12章 搜索框架ElasticSearch介绍和整合SpringBoot ============================= 加入小D课堂技术交 ...

  2. 一个nginx服务器配置多站点

    有时候你想在一台服务器上为不同的域名运行不同的站点.比如www.siteA.com作为博客,www.siteB.com作为论坛.你可以把两个域名的IP都解析到你的服务器上,但是没法在Nginx的根目录 ...

  3. 第十一章 IO流

    11.IO流 11.1 java.io.File类的使用 1课时 11.2 IO原理及流的分类 1课时 11.3 节点流(或文件流) 1课时 11.4 缓冲流 1课时 11.5 转换流 1课时 11. ...

  4. Spring IOC(四)总结升华篇

    本系列目录 Spring IOC(一)概览 Spring IOC(二)容器初始化 Spring IOC(三)依赖注入 Spring IOC(四)总结升华 =============正文分割线===== ...

  5. Zookeeper 集群搭建--单机伪分布式集群

    一. zk集群,主从节点,心跳机制(选举模式) 二.Zookeeper集群搭建注意点 1.配置数据文件 myid 1/2/3 对应 server.1/2/3 2.通过./zkCli.sh -serve ...

  6. C# System.IO和对文件的读写操作

      System.IO命名空间中常用的非抽象类 BinaryReader 从二进制流中读取原始数据 BinaryWriter 从二进制格式中写入原始数据 BufferedStream 字节流的临时存储 ...

  7. Spring生态研习【一】:定时任务Spring-task

    本系列具体研究一下spring生态中的重要或者常用的功能套件,今天从定时任务开始,主要是spring-task.至于quartz,下次找个时间再总结. 我的验证环境,是SpringCloud体系下,基 ...

  8. selenium基础用法(爬虫)

    初识selenium selenium最初是一个自动化测试工具,而爬虫中使用它主要是为了解决requests无法直接执行JavaScript代码的问题 selenium本质是通过驱动浏览器,完全模拟浏 ...

  9. centos7如何查询已运行服务?

    使用 systemctl list-unit-files 可以查看启动项 , 因为用chkconfig --list命令出现如下提示: 左边是服务名称,右边是状态,enabled是开机启动,disab ...

  10. 20175311 2018-2019-2 《Java程序设计》第1周学习总结

    教材学习内容总结 第一周我们主要尝试了怎么安装各种以后可能需要用到的软件,根据老师提供的博客教程进行自主学习安装软件,然后编写一些简单的语言程序. 教材学习中的问题和解决过程 问题1:在学习过程中主要 ...