Webpack风格!css!sass加载器

时间:2015-11-20 18:15:46

标签: html css sass webpack

我是Sass的新手,所以这可能是我的错。无论如何让我描述一下这个问题

html文件

   <ul>
      <li><a href="#">Facebook</a></li>
      <li><a href="#">Google</a></li>
      <li><a href="#">LinkedIn</a></li>
      <li><a href="#">Rss</a></li>
      <li><a href="#">Twitter</a></li>
      <li><a href="#">Yahoo</a></li>
    </ul>

我想为某些社交网络创建一个简单的链接列表。 对于构建我正在使用 webpack 和css-loader sass-loader和style-loader。

...
  module: {
    loaders: [
      {
        test: /\.scss$/,
        loaders: ['style',"css", "sass"]
      }
    ]
  }
 ...

在我没有尝试为我

中的每个 li 元素添加图片时效果很好

sass文件

$icons:(facebook, google, linkedin, rss, twitter, yahoo);
@each $item in $icons{
  .#{$item} {background: url('./images/#{$item}.png') no-repeat;}
}

我出错了

  

意外的令牌ILLEGAL您可能需要一个合适的加载器来处理   这个文件类型。

此文件夹中存在所有图像。

我做错了什么?我只是想为背景图像构建一个简单的URL。

1 个答案:

答案 0 :(得分:1)

您可能需要添加url-loader:

{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' }