jamesjieye / html-webpack-exclude-assets-plugin

Add the ability to exclude assets based on RegExp patterns
MIT License
52 stars 14 forks source link

webpack5 hook was not found #20

Open Sherry-hue opened 3 years ago

Sherry-hue commented 3 years ago

Hello, I upgraded webpack to v5, use this plug-in but find some errors.

HtmlWebpackExcludeAssetsPluginError: The expected HtmlWebpackPlugin hook was not found! Ensure HtmlWebpackPlugin is installed and was initialized before this plugin.

It seems that hook has been deleted after webpack5 upgrade,are there plans to update this plug-in to support webpack 5

simkessy commented 2 years ago

Did you ever solve this

cqlql commented 1 year ago

This is my modified code, which can be used directly.

var assert = require('assert');
const HtmlWebpackPlugin = require('html-webpack-plugin');

function HtmlWebpackExcludeAssetsPlugin (options) {
  assert.equal(options, undefined, 'The HtmlWebpackExcludeAssetsPlugin does not accept any options');
  this.PluginName = 'HtmlWebpackExcludeAssetsPlugin';
}

HtmlWebpackExcludeAssetsPlugin.prototype.apply = function (compiler) {
  compiler.hooks.compilation.tap(this.PluginName,  this.applyCompilation.bind(this));
};

HtmlWebpackExcludeAssetsPlugin.prototype.applyCompilation = function applyCompilation (compilation) {
  var self = this;

  HtmlWebpackPlugin.getHooks(compilation).alterAssetTagGroups.tapAsync(this.PluginName, registerCb)

  function registerCb (htmlPluginData, callback) {
    var excludeAssets = htmlPluginData.plugin.options.excludeAssets;
    // Skip if the plugin configuration didn't set `excludeAssets`
    if (!excludeAssets) {
      if (callback) {
        return callback(null, htmlPluginData);
      } else {
        return Promise.resolve(htmlPluginData);
      }
    }

    if (excludeAssets.constructor !== Array) {
      excludeAssets = [excludeAssets];
    }

    // Skip invalid RegExp patterns
    var excludePatterns = excludeAssets.filter(function (excludePattern) {
      return excludePattern.constructor === RegExp;
    });

    var result = self.processAssets(excludePatterns, htmlPluginData);
    if (callback) {
      callback(null, result);
    } else {
      return Promise.resolve(result);
    }
  }
};

HtmlWebpackExcludeAssetsPlugin.prototype.isExcluded = function (excludePatterns, assetPath) {
  return excludePatterns.filter(function (excludePattern) {
    return excludePattern.test(assetPath);
  }).length > 0;
};

HtmlWebpackExcludeAssetsPlugin.prototype.processAssets = function (excludePatterns, pluginData) {
  var self = this;
  var body = [];
  var head = [];

  pluginData.headTags.forEach(function (tag) {
    if (!tag.attributes || !self.isExcluded(excludePatterns, tag.attributes.src || tag.attributes.href)) {
      head.push(tag);
    }
  });

  pluginData.bodyTags.forEach(function (tag) {
    if (!tag.attributes || !self.isExcluded(excludePatterns, tag.attributes.src || tag.attributes.href)) {
      body.push(tag);
    }
  });

  return { headTags: head, bodyTags: body, plugin: pluginData.plugin, outputName: pluginData.outputName };
};

module.exports = HtmlWebpackExcludeAssetsPlugin;
danikaze commented 1 year ago

https://github.com/jamesjieye/html-webpack-exclude-assets-plugin/issues/20#issuecomment-1329421463

This is my modified code, which can be used directly.

it doesn't solve the problem for me