Question

我有一个可以使用的html文件，但是现在我想添加另外4个html文件。我用google搜索了一下，但没有找到答案。我尝试复制新的HTML Webpack插件，然后在其中插入html文件的新名称，但是当我尝试访问时，出现错误无法获取TheName.html

THIS IS MY CONFIG FILE


var path = require('path')

const HtmlWebPackPlugin = require("html-webpack-plugin");

module.exports =  {
    module: {
        rules:[
            {
               test: /\.html$/,
               use:[
                   {
                       loader:"html-loader",
                       options:{minimize:true}
                   },
               ]
            },
            {
                test:/\.(jpg|png)$/,
                use:[
                    {
                        loader:'file-loader',
                        options:{
                            name:'[name].[ext]',
                            outputPath:'img/',
                            publicPath:'img/'
                        }
                    }
                ]
            },
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader'],
            },
        ]
    },
    plugins: [
        new HtmlWebPackPlugin({
            template:"./src/index.html",
            filename:"./index.html",
        }),
    ],
}

Answer 1

实际上您是对的，您只需复制新的HtmlWebPackPlugin

这将工作


new HtmlWebPackPlugin({
            template:"src/index.html",
            filename:"index.html",
             inject: true
        },{

            template:"src/index-2.html",
            filename:"index-2.html",
            inject: true
}),

我想让你知道的一件事。

如果您有一个正在运行的任务，例如“ npm run dev”

您必须先停止它，然后再编辑wepback.config文件。然后再次运行它，否则webpack不会知道您所做的更改。

我如何在Webpack 4中使用乘法HTML文件

1 个答案: