Webpack 样式！css！sass 加载器答案

【问题标题】：Webpack style!css!sass loadersWebpack 样式！css！sass 加载器
【发布时间】：2016-02-23 08:07:15
【问题描述】：

我是 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;}
}

我出错了

Unexpected token ILLEGAL 你可能需要一个合适的加载器来处理此文件类型。

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

我做错了什么？我只想为背景图片构建一个简单的网址。

【问题讨论】：

标签： html css sass webpack

【解决方案1】：

您可能需要添加一个 url-loader：

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

【讨论】：