Upgrade to html-webpack-plugin 4

[jantimon]

The html-webpack-plugin version 4 is getting closer to a release.
Many information can be found in this pr: https://github.com/jantimon/html-webpack-plugin/pull/953

A static version property was added: https://github.com/jantimon/html-webpack-plugin/blob/d65b37d2c588047e0d81a38f4645fcdb3ead0b9e/index.js#L915-L927

The event system was changed alot to work with the new features:

Could you please give the new events a try and let me know if they work for your case? https://github.com/jantimon/html-webpack-plugin/tree/webpack-4#events

beforeAssetTagGeneration hook

    AsyncSeriesWaterfallHook<{
      assets: {
        publicPath: string,
        js: Array<{string}>,
        css: Array<{string}>,
        favicon?: string | undefined,
        manifest?: string | undefined
      },
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

alterAssetTags hook

    AsyncSeriesWaterfallHook<{
      assetTags: {
        scripts: Array<HtmlTagObject>,
        styles: Array<HtmlTagObject>,
        meta: Array<HtmlTagObject>,
      },
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

alterAssetTagGroups hook

    AsyncSeriesWaterfallHook<{
      headTags: Array<HtmlTagObject | HtmlTagObject>,
      bodyTags: Array<HtmlTagObject | HtmlTagObject>,
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

afterTemplateExecution hook

    AsyncSeriesWaterfallHook<{
      html: string,
      headTags: Array<HtmlTagObject | HtmlTagObject>,
      bodyTags: Array<HtmlTagObject | HtmlTagObject>,
      outputName: string,
      plugin: HtmlWebpackPlugin,
    }>

beforeEmit hook

    AsyncSeriesWaterfallHook<{
      html: string,
      outputName: string,
      plugin: HtmlWebpackPlugin,
    }>

afterEmit hook

    AsyncSeriesWaterfallHook<{
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

[Jorybraun]

Running into this problem now, is there any information about the hooks for webpack-concat-plugin. Ill just inject it manually as it stopped working.

[Jorybraun]

im about to make a pr but im not sure which branch to make the PR into.

[ymaz]

I'm using "html-webpack-plugin": "4.0.0-alpha.2", and that example above is not working for me:

Inject to html by hand
doctype html
...
    script(src=htmlWebpackPlugin.files.webpackConcat.flexible)
...

this part htmlWebpackPlugin.files.webpackConcat is not available under the htmlWebpackPlugin.files is that expected or I'm doing something wrong? my current settings are

const buildConfig = {
  inject: false,
  template: paths.appHtml,
};

[gvince01]

Hi @ymaz, did you ever resolve that issue? I've got exactly the same issue whereby i'm trying to access htmlWebpackPlugin.files.webpackConcat but it's is not available under the htmlWebpackPlugin.files

[Jorybraun]

@gvince01 my PR resolved my initial issue, I think this repo is dead.

Perhaps we should fork it and make a new npm package for webpack concat, it's been a year since my PR was made

https://github.com/hxlniada/webpack-concat-plugin/pull/71

I'd be happy to maintain this

Waiting on this to get approved actually really f'd me up at a previous job

[gvince01]

@Jorybraun Yeah I agree regarding forking it. Especially considering this plugin is still referenced in the html-webpack-plugin readme. That'd be great if you are happy to maintain it.

[Jorybraun]

@gvince01 im suprised more people don't have these issues: this plugin has 28,537 weekly downloads