使用webpack html-loader全局许多html文件？

Question

我试图散列和优化我的图像在由静态网站生成器雨果生成的HTML文件。

我能得到html-loader处理文件一次一个，使用的测试配置：

entry: { 
     main: './entry.js' 
    }, 
    module: { 
     rules: [ 
      { test: /\.jpg$/, use: [ "file-loader" ] }, 
      { test: /\.png$/, use: [ "file-loader" ] }, 
      { test: /\.html$/, use: ExtractTextPlugin.extract("html-loader") } 
     ] 
    }, 
    output: { 
     publicPath: "./", 
     filename: 'test.bundle.js' 
    } 

和entry.js很简单：含

require('./test.html'); 

：

<img src="test.png" data-src="test.png" > 

这很好用！我得到一个带有散列图像源的HTML文件，图像本身被散列。

我真正想要做的是能够遍历HTML文件的目录并获得类似的结果。

我已经试过的东西沿着线：

const glob = require('glob'); 

glob.sync("./*.html").forEach(function(file) { 
    require(path.resolve(file)); 
}); 

无济于事。

我一直在挖掘和挖掘，我似乎无法找到答案。任何想法赞赏！

Answer 1

原来，您可以将对象传递给Webpack作为入口点。因此，你所要做的就是将你想要的文件全部整理起来，然后将它转换为一个对象并将该对象用作你的条目。