webpack.jsを使用すると、scssで背景イメージを使用できないのはなぜですか？

Question

私はビルドプロジェクトのためwebpack.jsを使用します。 ヒスイ/ SCSS/JS/Node.jsの マイSCSSはCSSにコンパイルされます：http://localhost:3000/img/bg.png

しかし、それはです：

//SCSS 
    .heading { 
    background: url("/img/bg.png"); 
    } 

    //CSS 
    .heading { 
    background- image:url('data:image/svg+xml;base64,...'); 

画像は、URLで提供されています背景画像として表示されません。 私はCSS の画像に次の設定作業を含めるために、URL /ファイル・ローダーを使用する必要があることを知っているが、私はSCSS/cssファイル内の画像を使用することはできません

{ 
entry: "./src/js/main.js", 
devtool: "source-map", 
output: { 
    path: __dirname + "/public", 
    filename: "bundle.js" 
}, 
module: { 
    loaders: [ 
    { 
    test: /\.css$/, 
    loaders: ["style", "css"] 
    }, 
    { 
    test: /\.scss$/, 
    loaders: ["style", "css?sourceMap", "sass?sourceMap"] 
    }, 
    { 
    test: /\.png$/, 
    loaders: ["url-loader", "file-loader?sourceMap"] 
    } 
] 
} 
} 

Answer 1

私はthis oneのような追加のローダーを使用することをお勧めしますsass-loaderには過去にはknown issues with resolving URLsが含まれていますので、これはあなたにとって解決策になるかもしれません。