Question

我想在Webpack捆绑期间从一个文件中注入一些HTML到另一个文件。

假设我有一个像这样的index.html文件：

//index.html
<html>
    <head></head>
    <body>
        <p>Hello World</p>
    </body>
</html>

和另一个带有一堆图标的文件：

//another.html
<symbol id="a" ...>...</symbol>
<symbol id="b" ...>...</symbol>
<symbol id="c" ...>...</symbol>

然后我希望我的“index.html”文件在运行webpack后看起来像这样：

//index.html in bundle
<html>
    <head></head>
    <body>
        <symbol id="a" ...>...</symbol>
        <symbol id="b" ...>...</symbol>
        <symbol id="c" ...>...</symbol>
        <p>Hello World</p>
    </body>
</html>

基本上，我只是希望文件中的任何内容都包含在index.html的主体中。我已经浏览了整个webpack生态系统，但我找不到任何能满足我想要的东西。

我现在使用的网络包配置正在使用html-webpack-plugin：

{
    ....
    plugins: [
        new HtmlWebpackPlugin({
            template: "index.html",
            inject: true,
        })
    ],
}

有问题的文件来自我的一个依赖项，因此我无法在那里进行任何更改或手动复制内容，但我知道包含它们的文件夹的路径，所以我希望我能够使用loader / plugin来处理这个问题。

问题：是否有一个webpack加载器/插件可以执行此操作？

使用Webpack将HTML内容注入另一个文件

0 个答案: