javascript - Webpack file-loader で画像ファイルをエクスポートするためのマルチパスを設定する方法

Question

モジュールバンドルを構築するためにWebpackを研究しています。file-loader を使用して、javascript で画像ファイルを読み込みます。これらの行は、イメージ ファイルをロードするために使用されます。

  {
    test: /\.(jpe?g|png|gif|svg)$/i,
    use: [
      {
        loader: 'file-loader',
        options: {
          name: 'images/[name].[ext]'
        }
      },
      'image-webpack-loader'
    ]
  }

しかし、私はそれに問題があります。イメージ パスが期待どおりに css にコンパイルされていません。私のアプリは構造を持っています:

画像は、require()によって app/views/index.pug に読み込まれます。

img(src= require('../images/logo.png'), alt= 'logo')

app/styles/style.cssのbackground-image: url() :

.test {
  background-image: url('../images/logo.png');
}

====== コンパイル後、build/index.html のイメージ パスは次のとおりです。

<img src="images/logo.png" alt="logo">

ただし、build/css/style.css のイメージ パスは次のとおりです。

.test {
  background-image: url(images/logo.png);
}

ファイルローダーがhtmlまたはcssで画像をスキャンしていることをどのように検出できますか? または、この問題を解決するための解決策はありますか?

ありがとうございました。