Issue with webpack --watch?

[lautarodragan]

I'm having an issue when running Webpack with the --watch option.

If I manually modify the javascript file that gets compiled and inlined, the file does get compiled and built into the dist directory, but the html file isn't updated and the inlined code stays outdated.

If I manually modify the html file, then the inline code does get updated.

Doing some minor debugging of the plugin source code...

HtmlWebpackInlineSourcePlugin.prototype.apply = function (compiler) {
  var self = this;

  // Hook into the html-webpack-plugin processing
  compiler.hooks.compilation.tap('html-webpack-inline-source-plugin', compilation => {
    // this line is reached every time a change is made to the source code
    self.htmlWebpackPlugin
      .getHooks(compilation)
      .alterAssetTagGroups.tapAsync('html-webpack-inline-source-plugin', (htmlPluginData, callback) => {
        // this line is only reached on the first iteration (when manually running webpack --watch but not when changes are detected)
        if (!htmlPluginData.plugin.options.inlineSource) {
          return callback(null, htmlPluginData);
        }

        var regexStr = htmlPluginData.plugin.options.inlineSource;

        var result = self.processTags(compilation, regexStr, htmlPluginData);

        callback(null, result);
      });
  });
};

Maybe there's an issue with the way the plugin is hooking into html-webpack-plugin processing?

Running version 1.0.0-beta.2 of this plugin and 4.2.0 of html-webpack-plugin.

[sisiea]

error same here.

[koraga]

Use cache: false for html-webpack-plugin.
Example:

new HtmlWebpackPlugin({
   template: './src/ui/index.html',
   filename: 'index.html',
   inlineSource: '.(js)$',
   chunks: ['ui'],
   cache: false,
}),
new HtmlWebpackInlineSourcePlugin(HtmlWebpackPlugin),

its works for me