解决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 相关文章推荐
通过上下左右键和回车键切换光标实现代码
Mar 08 Javascript
在服务端(Page.Write)调用自定义的JS方法详解
Aug 09 Javascript
js 异步操作回调函数如何控制执行顺序
Dec 24 Javascript
Javascript的闭包详解
Dec 26 Javascript
jQuery+PHP实现可编辑表格字段内容并实时保存
Oct 09 Javascript
JQuery在循环中绑定事件的问题详解
Jun 02 Javascript
Bootstrap下拉菜单更改为悬停(hover)触发的方法
May 24 Javascript
浅谈React Native 中组件的生命周期
Sep 08 Javascript
react-native中ListView组件点击跳转的方法示例
Sep 30 Javascript
Django中使用jquery的ajax进行数据交互的实例代码
Oct 15 jQuery
vuex与组件联合使用的方法
May 10 Javascript
vue 点击其他区域关闭自定义div操作
Jul 17 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内存相关的功能特性详解
2013/06/08 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
php实现保存周期为1天的购物车类
2017/07/07 PHP
thinkPHP5框架实现基于ajax的分页功能示例
2018/06/12 PHP
Node.js中的流(Stream)介绍
2015/03/30 Javascript
js实现漂浮回顶部按钮实例
2015/05/06 Javascript
Hallo.js基于jQuery UI所见即所得的Web编辑器
2016/01/26 Javascript
浅析JS获取url中的参数实例代码
2016/06/14 Javascript
Javascript中内建函数reduce的应用详解
2016/10/20 Javascript
html5+CSS 实现禁止IOS长按复制粘贴功能
2016/12/28 Javascript
详解用场景去理解函数柯里化(入门篇)
2019/04/11 Javascript
微信小程序自定义yPicker组件实现省市区三级联动功能
2020/10/29 Javascript
vue实现滚动鼠标滚轮切换页面
2020/12/13 Vue.js
vue中activated的用法
2021/01/03 Vue.js
pyqt和pyside开发图形化界面
2014/01/22 Python
wxPython中listbox用法实例详解
2015/06/01 Python
Python实现将多个空格换为一个空格.md的方法
2018/12/20 Python
Python实现把类当做字典来访问
2019/12/16 Python
Keras 加载已经训练好的模型进行预测操作
2020/06/17 Python
python pygame 愤怒的小鸟游戏示例代码
2021/02/25 Python
HTML5单选框、复选框、下拉菜单、文本域的实现代码
2020/12/01 HTML / CSS
耐克美国官网:Nike.com
2016/08/01 全球购物
工程力学硕士生的自我评价范文
2013/11/16 职场文书
财务会计人员求职的自我评价
2014/01/13 职场文书
办公室文员自荐书
2014/02/03 职场文书
祖国在我心中演讲稿600字
2014/05/04 职场文书
人力资源本科毕业生求职信
2014/06/04 职场文书
2014年公务员退休工资改革方案
2014/10/01 职场文书
2014年秘书工作总结
2014/11/25 职场文书
世界遗产的导游词
2015/02/13 职场文书
办公室卫生管理制度
2015/08/04 职场文书
小学语文教师研修日志
2015/11/13 职场文书
区域销售大会开幕词
2016/03/04 职场文书
2019销售早会主持词
2019/06/27 职场文书
大学生创业计划书常用模板
2019/08/07 职场文书
Nest.js参数校验和自定义返回数据格式详解
2021/03/29 Javascript