Dynamic entry with using devMiddleware.invalidate will not generate the new html

[moyueating]

Currently using webpack5, html-webpack-plugin, I want to achieve incremental compilation through dynamic entry, but when I trigger the update through devmiddleware.invalidate(), I only get the compiled js and css files but not the expected html files. The following is the general configuration and usage.

let cacheEntries = [ 'pages/page1/main.js' ] 

module.exports = {
    entry = () => cacheEntries,
    optimization: {
         runtimeChunk: 'single'
    },
    devServer: {
         onBeforeSetupMiddleware: devServer => {
             const app = devServer.app;
             const compiler = devServer.compiler 
             const devMiddlewareInstance = devServer.middleware
             app.use((req, res, next) => {
                      cacheEntries['page2'] = [path.resolve(process.cwd(), `./src/pages/page2/main.js`)]
                      new HTMLWebpackPlugin({
                           filename: 'page2/index.html',
                           template: path.resolve(process.cwd(), './public/index.html')  
                      }).apply(compiler)
                      devMiddlewareInstance.invalidate()
            })
        }
    }
}

Then I looked at the source code of html-webpack-plugin and found that entryOptions is handled on the hook of compiler.initialize. Does this mean that dynamic entry is not supported? If it is really not supported, is there any good way for the implementation of dynamic entry incremental compilation?

Looking forward to your answer, thanks！

[DaveDev13]

@jantimon Hi, I also faced such a problem, can you tell me?

[alexander-akait]

I want to close this in favor of #1768, because html-webpack-plugin uses hook to init options, it doesn't work dynamically right now (more context - webpack/webpack#16312 (comment)), I want to fix it soon