解决vue打包css文件中背景图片的路径问题


Posted in Javascript onSeptember 03, 2018

vue-cli写完的静态页面我们在node环境中引入没有问题,但是打包后放在Apache环境下,路径却有问题了

如一个简单css语句

.welcome { width: 420px; height: 235px; background: url(../img/welcome.jpg) 0 0 no-repeat;

但是打包后路径成了却出现404访问不到的问题。

解决的办法很简单

build路径下utils.js文件

// Extract CSS when that option is specified
 // (which is the case during production build)
 if (options.extract) {
  return ExtractTextPlugin.extract({
  use: loaders,
  fallback: 'vue-style-loader',
  publicPath:'../../'   //添加此代码!!!
  })
 } else {
  return ['vue-style-loader'].concat(loaders)
 }

以上这篇解决vue打包css文件中背景图片的路径问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript下4个跨浏览器必备的函数
Mar 07 Javascript
javascript parseInt() 函数的进制转换注意细节
Jan 08 Javascript
jQuery 属性选择器element[herf*='value']使用示例
Oct 20 Javascript
JS获取键盘上任意按键的值(实例代码)
Nov 12 Javascript
Javascript基础教程之比较操作符
Jan 18 Javascript
详解JavaScript中的blink()方法的使用
Jun 08 Javascript
快速掌握Node.js中setTimeout和setInterval的使用方法
Mar 21 Javascript
关于angularJs指令的Scope(作用域)介绍
Oct 25 Javascript
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 jQuery
Layer弹出层动态获取数据的方法
Aug 20 Javascript
node实现分片下载的示例代码
Oct 17 Javascript
vue下canvas裁剪图片实例讲解
Apr 16 Javascript
解决Vue2.0中使用less给元素添加背景图片出现的问题
Sep 03 #Javascript
vue组件(全局,局部,动态加载组件)
Sep 02 #Javascript
详解jQuery中的easyui
Sep 02 #jQuery
vue-cli脚手架的安装教程图解
Sep 02 #Javascript
vue-router 实现导航守卫(路由卫士)的实例代码
Sep 02 #Javascript
全面解析vue router 基本使用(动态路由,嵌套路由)
Sep 02 #Javascript
解决Vue 项目打包后favicon无法正常显示的问题
Sep 01 #Javascript
You might like
mac下使用brew配置环境的步骤分享
2011/05/23 PHP
PHP得到mssql的存储过程的输出参数功能实现
2012/11/23 PHP
php不写闭合标签的好处
2014/03/04 PHP
PHP中ini_set与ini_get用法实例
2014/11/04 PHP
PHP静态文件生成类实例
2014/11/29 PHP
php时间计算相关问题小结
2016/05/09 PHP
PHP解决中文乱码
2017/04/28 PHP
jquery.ui.draggable中文文档
2009/11/24 Javascript
JS+CSS实现仿触屏手机拨号盘界面及功能模拟完整实例
2015/05/16 Javascript
Bootstrap Modal遮罩弹出层(完整版)
2016/11/21 Javascript
用director.js实现前端路由使用实例
2017/01/27 Javascript
vue使用keep-alive实现数据缓存不刷新
2017/10/21 Javascript
快速处理vue渲染前的显示问题
2018/03/05 Javascript
浅谈Node框架接入ELK实践总结
2019/02/22 Javascript
原生JS实现顶部导航栏显示按钮+搜索框功能
2019/12/25 Javascript
解决Vue-Router升级导致的Uncaught (in promise)问题
2020/08/07 Javascript
Python变量和字符串详解
2017/04/29 Python
Python模块搜索路径代码详解
2018/01/29 Python
Python 确定多项式拟合/回归的阶数实例
2018/12/29 Python
python numpy 矩阵堆叠实例
2020/01/17 Python
python 通过邮件控制实现远程控制电脑操作
2020/03/16 Python
jupyter notebook 增加kernel教程
2020/04/10 Python
python快速安装OpenCV的步骤记录
2021/02/22 Python
解决python的空格和tab混淆而报错的问题
2021/02/26 Python
台湾团购、宅配和优惠券:17Life
2017/08/14 全球购物
澳大利亚排名第一的儿童在线玩具商店:Toy Galaxy
2018/10/06 全球购物
Surfdome西班牙:世界上最受欢迎的生活方式品牌
2019/02/13 全球购物
网络事业创业计划书范文
2014/01/09 职场文书
语文教学随笔感言
2014/02/18 职场文书
演讲稿祖国在我心中
2014/05/04 职场文书
车辆转让协议书
2014/09/24 职场文书
2014年科室工作总结
2014/11/20 职场文书
办公室个人总结
2015/02/28 职场文书
2015小学毕业班工作总结
2015/07/21 职场文书
导游词之上饶龟峰
2019/10/25 职场文书
2019年农民幸福观调查的实践感悟
2019/12/19 职场文书