解决Vue编译时写在style中的路径问题


Posted in Javascript onSeptember 21, 2017

写在vue文件里面的style样式,在添加例如背景图片的时候,如果用的是相对路径,那么build出来的css文件的路径将会出错,导致找不到图片。

解决Vue编译时写在style中的路径问题

通过查找资料,在https://segmentfault.com/q/1010000008438061有人的回答解决了问题。

解决Vue编译时写在style中的路径问题

要修改主要有两个,一个就是config/index.js文件,将assetsPublicPath的路径改为'./',这是发布路径,如果构建后的产品文件有用于发布CDN或者放到其他域名的服务器,可以在这里进行设置设置之后构建的产品文件在注入到index.html中的时候就会带上这里的发布路径

解决Vue编译时写在style中的路径问题

另外一个修改就是上图了,添加,publicPath: '../../'这一行,这是配置extract-text-plugin插件的提取样式,具体是什么我也不清楚。

解决Vue编译时写在style中的路径问题

问题说完了,希望对大家有帮助,写下来也是方便自己日后出现问题可以查看。谢谢!

以上这篇解决Vue编译时写在style中的路径问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用于判断用户注册时,密码强度的JS代码
Jan 01 Javascript
Javascript Global对象
Aug 13 Javascript
javascript appendChild,innerHTML,join性能比较代码
Aug 29 Javascript
JQuery slideshow的一个小问题(如何发现及解决过程)
Feb 06 Javascript
select标记美化--JS式插件、后期加载
Apr 01 Javascript
JavaScript Ajax Json实现上下级下拉框联动效果实例代码
Nov 23 Javascript
js与C#进行时间戳转换
Nov 14 Javascript
jQuery实现购物车数字加减效果
Mar 14 Javascript
AngularJS实践之使用NgModelController进行数据绑定
Oct 08 Javascript
JS中检测数据类型的几种方式及优缺点小结
Dec 12 Javascript
jQuery EasyUI 为Combo,Combobox添加清除值功能的实例
Apr 13 jQuery
elementUI select组件使用及注意事项详解
May 29 Javascript
使用JS实现图片轮播的实例(前后首尾相接)
Sep 21 #Javascript
Node调用Java的示例代码
Sep 20 #Javascript
浅谈react前后端同构渲染
Sep 20 #Javascript
微信页面弹出键盘后iframe内容变空白的解决方案
Sep 20 #Javascript
微信小程序 页面跳转事件绑定的实例详解
Sep 20 #Javascript
微信小程序 数据绑定及运算的简单实例
Sep 20 #Javascript
Angularjs使用过滤器完成排序功能
Sep 20 #Javascript
You might like
php实现文件下载更能介绍
2012/11/23 PHP
CentOS 6.2使用yum安装LAMP以及phpMyadmin详解
2013/06/17 PHP
yii的入口文件index.php中为什么会有这两句
2016/08/04 PHP
thinkPHP+ajax实现统计页面pv浏览量的方法
2017/03/15 PHP
Laravel 5.5 的自定义验证对象/类示例代码详解
2017/08/29 PHP
基于laravel Request的所有方法详解
2019/09/29 PHP
传递参数的标准方法(jQuery.ajax)
2008/11/19 Javascript
JavaScript与DOM组合动态创建表格实例
2012/12/23 Javascript
javascript创建createXmlHttpRequest对象示例代码
2014/02/10 Javascript
jQuery中:input选择器用法实例
2015/01/03 Javascript
Windows系统下使用Sublime搭建nodejs环境
2015/04/13 NodeJs
js一维数组、多维数组和对象的混合使用方法
2016/04/03 Javascript
VUE 实现滚动监听 导航栏置顶的方法
2018/09/11 Javascript
解决js相同的正则多次调用test()返回的值却不同的问题
2018/10/10 Javascript
javascript实现日历效果
2019/06/17 Javascript
Vue v-for循环之@click点击事件获取元素示例
2019/11/09 Javascript
使用element-ui +Vue 解决 table 里包含表单验证的问题
2020/07/17 Javascript
Python中的map、reduce和filter浅析
2014/04/26 Python
python基础教程之自定义函数介绍
2014/08/29 Python
python求crc32值的方法
2014/10/05 Python
Python3中详解fabfile的编写
2018/06/24 Python
解决Python中定时任务线程无法自动退出的问题
2019/02/18 Python
Tensorflow 实现分批量读取数据
2020/01/04 Python
Python+Dlib+Opencv实现人脸采集并表情判别功能的代码
2020/07/01 Python
HTML5 实现一个访问本地文件的实例
2012/12/13 HTML / CSS
canvas实现扭蛋机动画效果的示例代码
2018/10/17 HTML / CSS
Omio西班牙:全欧洲低价大巴、火车和航班搜索和比价
2017/02/11 全球购物
GOLFINO英国官网:高尔夫服装
2020/04/11 全球购物
机电专业毕业生推荐信
2013/11/10 职场文书
质检的岗位职责
2013/11/17 职场文书
创业计划书怎样才能打动风投
2014/01/01 职场文书
党员评议自我评价
2015/03/03 职场文书
我在伊朗长大观后感
2015/06/16 职场文书
保姆聘用合同
2015/09/21 职场文书
加强党性修养心得体会
2016/01/21 职场文书
如何用JS实现简单的数据监听
2021/05/06 Javascript