码迷,mamicode.com
首页 > Windows程序 > 详细

webpack window 处理图片和其他静态文件

时间:2016-04-01 14:33:12      阅读:322      评论:0      收藏:0      [点我收藏+]

标签:

安装url-loader

npm install url-loader --save-dev

配置config文件

      {
        test: /\.(png|jpg)$/,
        loader: ‘url?limit=40000‘
      }

注意后面那个limit的参数,当你图片大小小于这个限制的时候,会自动启用base64编码图片。

下面举个栗子。

新建一个imgs文件夹,往里面添加一张崔叔的照片。在scss文件中添加如下的东西。

@import "./variables.scss";

h1 {
  color: $red;
  background: url(‘../imgs/avatar.jpg‘);
}

npm start, 然后查看图片的url,发现神奇。

 

 

技术分享

webpack window 处理图片和其他静态文件

标签:

原文地址:http://www.cnblogs.com/yuwensong/p/5344638.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!