Webpack url-loader 反复内联图片

Question

我是 webpack 的新手，我正在使用带有以下选项的 url-loader：

{
    test: /\.(png|jp(e*)g|svg|gif)$/,  
    use: [
           {
             loader: 'url-loader',
             options: { 
                 limit: 8000 
             } 
           }
         ]
  },

现在，如果我在 index.html 中使用相同的来源编写多个图像

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

url-loader 会在每个 img 标签中内联 base64 编码的图像，这当然是错误的

那么在不允许这种重复的情况下引用 base64 编码图像的正确方法是什么？

Answer 1

这是url-loader 的预期行为。如果您希望 Webpack 不内联您的本地图像，而是发出单独的文件，请改用 file-loader。