带有Stylus-loader和Url-Loader的Webpack无法加载图像

时间:2016-11-03 18:54:04

标签: webpack stylus urlloader

我有以下结构

...
  login
    login.styles.styl
    background.png

在Webpack中

...
{
  test: /\.styl$/,
  loader: "style-loader!css-loader!stylus-loader"
},
{
  test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?.*)?$/,
  loader: 'url?limit=900000'
}
...

在login.styles.styl中,我尝试了所有这些但没有工作......

background: url(./background.png)
background: url('./background.png')
background: './background.png'

我也按照this question尝试了这个但是它不起作用......

{
  test:   /\.styl$/,
  loader: 'style!css!stylus?resolve url'
}

知道我可能缺少什么吗?

更新

我忘了,因为这是一个ng2应用程序,它没有使用相同的通用加载器...

styles: [require('!raw!stylus!./login.styles.styl')],

我试过了两次

styles: [require('!raw!css!stylus!./login.styles.styl')],
styles: [require('!to-string!css!stylus!./login.styles.styl')],

但似乎都不起作用

1 个答案:

答案 0 :(得分:0)

出于某种原因,这最终工作......

    {
      test: /\.styl$/,
      loaders: ["to-string", "css", "stylus"]
    },