在项目开发中，一般写相对路径是没有问题的，但是在项目比较大的情况下，我的scss文件可能为了方便管理，会放在不同的文件夹下，有的可能又不需要放在文件夹下,比如我的scss文件结构如下：

module

common.scss

test.scss

about

about.scss

login.scss

index.scss

比如目录是这样的，common.scss里用相对路径引用的图片，那about文件下的login.scss @import common.scss， 同时index.scss 也@import common.scss，那路径就不能同时满足2个个scss文件的需求，我们就需要用绝对路径来处理，那如何用绝对路径呢？

开始尝试了用webpack的插件resolve-url-loader去解决，不过折腾半天还是没有实现，最后是通过在公共的common.jsx文件里直接require(' common.scss'),这样别的模块在需要使用公共模块common.jsx的时候，require('common.jsx')连同scss文件一起引入进去了，这样就解决了图片路径的问题了。当然这只是其中的一个方法

如何解决webpack中css背景图片的绝对地址的更多相关文章

  1. Vue项目打包发布后CSS中的背景图片不显示

    相信有很多同学在学习vue的刚开始都遇到过项目打包发布后发现CSS中的背景图片不显示,具体如何解决只需要更改bind的配置即可 修改 build/utils.js 中的 generateLoaders ...

  2. css网页中设置背景图片的方法详解

    在css代码中设置背景图片的方法,包括背景图片.背景重复.背景固定.背景定位等   用css设置网页中的背景图片,主要有如下几个属性: 1,背景颜色 {">说明:参数取值和颜色属性一样 ...

  3. 利用wget 抓取 网站网页 包括css背景图片

    利用wget 抓取 网站网页 包括css背景图片 wget是一款非常优秀的http/ftp下载工具,它功能强大,而且几乎所有的unix系统上都有.不过用它来dump比较现代的网站会有一个问题:不支持c ...

  4. css背景图片加载失败，页面部分图标无法显示

    1.问题表现:首屏缺失部分图标.点击按钮切换为激活状态时,部分按钮的激活态图标无法显示. 2.问题原因:网络极差,断断续续,点击时添加class:active变为激活态, active.png这张图片 ...

  5. Bootstrap css背景图片的设置

    一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...

  6. css背景图片拉伸 以及100% 满屏显示

    如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...

  7. div css背景图片不显示

    我们在写页面时,为了便于维护,css样式通常都是通过link外部导入html的,有时在css中写入背景图片时,此时背景图片的路径应该是相对css文件的.比如,此时的文件有index.html,css. ...

  8. CSS背景图片定位

    原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...

  9. 兼容各浏览器的css背景图片拉伸代码

    需要用到背景图拉伸,找到了下面这段css代码: filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='***.jpg' , s ...

随机推荐

  1. UVaLive 6853 Concert Tour (DP)

    题意:给定 n 个城市,m 个月,表示要在这 n 个城市连续 m 个月开演唱会,然后给定每个月在每个城市开演唱会能获得的利润,然后就是演唱会在不同城市之间调动所要的费用, 问你,怎么安排这 n 个演唱 ...

  2. ASP.NET Response.Cookies

    //设置cookie Response.Cookies["loginPage"].Value = "login.aspx"; //命名并给值 Response. ...

  3. [Xcode 实际操作]三、视图控制器-(3)使用UINavigationController视图控制器

    目录:[Swift]Xcode实际操作 本文将演示导航视图控制器的使用. 选择项目导航区的资源文件夹.需要导入两张图片,作为选项卡控制器的图标. [+]->[Import]->选择图片-& ...

  4. struts2学习笔记 day02 获取参数 访问ServletAPI 结果类型

  5. 牛客寒假6-D.美食

    链接:https://ac.nowcoder.com/acm/contest/332/D 题意: 小B喜欢美食. 现在有n个美食排成一排摆在小B的面前,依次编号为1..n,编号为i的食物大小为 a[i ...

  6. python入门之lambda表达式、内置函数

    lambda 简单的函数就可以用lambda表达式 格式: abc = lambda a1,a2:a1+a2 其中,传参是a1和a2,返回值是a1+a2 内置函数 abs(a) #取绝对值 all(a ...

  7. linux 打开FTP 功能

    http://blog.csdn.net/jay285979220/article/details/62216622 今天在linux上安装完了vsftpd后,使用root账号一直无法登陆到服务器上. ...

  8. 转 OUI and OPatch Do Not Recognize JDK/JRE on Windows

    issue 1: 新覆盖的opatch 提示,无法opatch 报错 此时不应有1.6 D:\app\Administrator\product\11.2.0\dbhome_1\OPatch\ocm\ ...

  9. 关于ssh的介绍

    最近看到一篇关于介绍ssh讲得很清晰的文章,这里来记录一下加深一下印象: 基本原理: SSH(Secure Shell)是一套协议标准,可以用来实现两台机器之间的安全登录以及安全的数据传送,其保证数据 ...

  10. Ceizenpok’s formula Gym - 100633J 扩展Lucas定理 + 中国剩余定理

    http://codeforces.com/gym/100633/problem/J 其实这个解法不难学的,不需要太多的数学.但是证明的话,我可能给不了严格的证明.可以看看这篇文章 http://ww ...