webpack - Webpack 结合 html-loader 和 file-loader 来复制模板

Question

我正在尝试做的是结合html-loader复制从 html 模板引用的资产，例如<img src="some/path/here.jpg" />并将file-loader这些 html 模板复制到 bundle 文件夹中。我不想将这些 html 文件直接嵌入到 javascript 包中。

我认为这会起作用，但它不是：

{
    test: /\.html$/,
    loaders: ['file-loader?name=templates/[name]-[hash].[ext]', 'html-loader']
},
{
    test: /\.jpg$/,
    loader: 'file-loader?name=assets/[name]-[hash].[ext]'
}

我最终在我复制的 html 模板中有这个：

module.exports = "<img src=\"" + require("../img/image.jpg") + "\" />";

任何帮助将非常感激。

编辑

澄清。

我的 html 模板具有以下内容：

<img src="../img/image.jpg" />

运行 webpack 后，image.jpg不会复制到assets/文件夹。html 模板被复制到templates/文件夹中，但其内容为：

module.exports = "<img src=\"" + require("../img/image.jpg") + "\" />";

而我希望它是：

<img src="../assets/image-webpackHashHere.jpg" />

当然，图像应该以计算的名称（带有哈希）复制到那里。