v3.5.5

Cumulative Release v3.5.1 - v3.5.5

Bug Fixes

• Fixed parsing the data passed via query in JSON notation, e.g.: index.ejs?{"title":"Homepage","lang":"en"}.
• Fixed the parsing of the generated HTML, ignore files already resolved via a preprocessor, e.g. pug.
• Fixed the resolving the resource required in pug code and content, also outer tag attributes.
• Fixed the resolving of images generated via responsive-loader when used query parameters with , and & separators.
• Fixed the resolving of the required resources in multiple pages, in Pug templates.
• Fixed when used TS then could not find a declaration file for module 'html-bundler-webpack-plugin'.

Optimisations

• Initialize the Config only once.
• Lazy load the plugin config file.
• Optimize code for other plugins extending from this plugin.

Documentation

The entry option can be as array of entry items:

{
  entry: [
    {
      filename: 'index.html', // output filename in dist/
      import: 'src/views/index.html', // template file
      data: { title: 'Homepage' }, // page specifically variables
    },
    {
      filename: 'news/sport.html',
      import: 'src/views/news/sport/index.html',
      data: { title: 'Sport' },
    },
  ],
}

v3.5.0

Features

• Added support for Pug templating engine.
  The pug preprocessor based on the @webdiscus/pug-loader source code and has the same options and features.

v3.4.12

Cumulative Release v3.4.7 - v3.4.12

Bug Fixes

• Fixed serialization issue when used the cache.type = 'filesystem'.
• Fixed missing output js files after second run build when used the cache.type = 'filesystem'.
• Fixed error by resolving url() in the CSS file defined in the entry option.
• Fixed save the webmanifest files in the directory defined in the faviconOptions.path option.
• Fixed use the favicons default options for the build-in FaviconsBundlerPlugin when no plugin options.
• Fixed error by resolving url(date:image...) in CSS.
• Fixed if the same CSS file is imported in many js files, then the CSS is extracted for the first issuer only, #68.

v3.4.6

Cumulative Release v3.2.0 - v3.4.6

Features

• Added support for Twig templating engine.
• Added support for the template function on the client-side for Eta templating engine.
• Added support for the template function on the client-side for EJS templating engine.

Bug Fixes

• Fixed the pathData.filename is undefined after changes when the js.filename is a function, #66.
• Fixed extraction CSS from complex libs like MUI that leads to an infinity walk by circular dependency, #59
• Fixed an error explaining when used the build-in favicon plugin and the template not included a link tag, #64.
• Fixed watching changes in template function imported in JS, #60.
• Fixed runtime error using template function in JS when external data is not defined, #60.

v3.1.3

Features

• Added support for the template function in JS runtime on the client-side in the browser.
  For example:

import personTmpl from './partials/person.ejs';

// render template function with variables in browser
document.getElementById('person').innerHTML = personTmpl({ name: 'Walter White', age: 50});

The template function works with preprocessors: ejs, handlebars, nunjucks.
Note: The eta (default preprocessor) doesn't support the template function in JS on the client-side, use the ejs instead.

• Added CSS extraction from styles used in *.vue files.
  For example, MyComponent.vue:

  <template>
    ...
  </template>
  <script setup>
    ...
  </script>
  <!-- CSS will be extracted from the SCSS file into a separate *.css file -->
  <style src="./style.scss" lang="scss"></style>
  <!-- CSS will be extracted from the style tag into a separate *.css file -->
  <style>
    h1 {
      color: red;
    }
  </style>

Bug fixes

• FIxed access to @root variables in Handlebars partial helper inside the each block.

v3.0.3

Bug fixes

• Fixed installation error 'Invalid tag name of the favicons package' (introduced in v3.0.0).
• Added the missing plugins directory to package.

v3.0.1

🔆 What's New in v3

• Added Hooks & Callbacks. Now you can create own plugin to extend this plugin.
• Added the build-in FaviconsBundlerPlugin to generate and inject favicon tags.

⚠ BREAKING CHANGE (v3.0.0):

Changed arguments and return of the postprocess callback option.

OLD < v3.0.0:

postprocess(content: string, info: TemplateInfo, compilation: webpack.Compilation): string | null;

type TemplateInfo = {
  filename: string | ((pathData: PathData) => string);
  assetFile: string;
  sourceFile: string;
  outputPath: string;
  verbose: boolean | undefined;
};

When return null then the template processing was skipped.

NEW >= v3.0.0 :
Removed unused/useless properties: filename, verbose.
Added properties: name, resource.

postprocess(content: string, info: TemplateInfo, compilation: webpack.Compilation): string | undefined;

type TemplateInfo = {
  name: string; // the entry name
  assetFile: string; // the output asset filename relative to output path
  sourceFile: string;  // the source filename without a query
  resource: string; // the source filename including a query
  outputPath: string; // output path of assetFile
};

When return null or undefined then the content stay unchanged by postprocess and will be procedded in next hooks/callbacks.

Features

• Added beforePreprocessor hook.

• Added beforePreprocessor callback option.

• Added preprocessor hook.

• Added resolveSource hook.

• Added postprocess hook

• Optimized postprocess callback option, moved from renderManifest sync hook to processAssets async hook.

• Added beforeEmit hook.

• Added beforeEmit callback option.

• Added afterEmit hook.

• Added afterEmit callback option.

• Added possibility to create own plugin using the hooks: beforePreprocessor, preprocessor, resolveSource, postprocess, beforeEmit, afterEmit.

• Added the first plugin (plugin for bundler plugin :-) - FaviconsBundlerPlugin to generate and inject favicon tags for many devices.
  For example:

  const HtmlBundlerPlugin = require('html-bundler-webpack-plugin');
  const { FaviconsBundlerPlugin } = require('html-bundler-webpack-plugin/plugins');
  
  module.exports = {
    plugins: [
      new HtmlBundlerPlugin({
        entry: {
          index: './src/views/index.html',
        },
      }),
      // add the plugin to extend the functionality of the HtmlBundlerPlugin
      new FaviconsBundlerPlugin({
        faviconOptions: { ... }, // favicons configuration options
      }),
    ],
  };

  If you use the favicons-bundler-plugin, you need to install the favicons module.

• Added possibility to load CSS file dynamically in JavaScript.
  For example:

  function loadCSS(file) {
    const style = document.createElement('link');
    style.href = file;
    style.rel = 'stylesheet';
    document.head.appendChild(style);
  }
  
  loadCSS(require('./style.scss?url')); // <= dynamic load the source style file with `url` query

• Added js.inline.attributeFilter option to keep some original script tag attributes when JS is inlined.
  For example, keep the id and text/javascript attributes by inlined <script id="my-id">...inlined JS code...</script>:

  new HtmlBundlerPlugin({
    // ...
    js: {
      inline: {
        attributeFilter: ({ attributes, attribute, value }) => {
          if (attribute === 'type' && value === 'text/javascript') return true;
          if (attribute === 'id' && attributes?.type === 'text/javascript') return true;
        },
      },
    },
  }

Bug Fixes

• Added the root dir of the module to exports field in the package.json.

v2.15.2

Bug fixes

• Fixed an error when used integrity with the root publicPath option, like output.publicPath: '/some/path/'.

v2.15.1

Bug fixes

• Fixed an error when used integrity with the option output.publicPath: '/'. Issues: #42, #43

v2.15.0

Cumulative Release v2.14.1 - v2.15.0

Features

• Added parsedValue argument as an array of parsed filenames w/o URL query, in the filter() function of the sources.
  The parsedValue is useful to use with the srcset attribute with many image files.

Bug Fixes

• BREAKING CHANGE: Fixed the type of the value argument for srcset attribute, it is now string (was as Array<string>), in the filter() function of the sources.
  Note: for srcset attribute you can use the parsedValue as an array instead of the value, the value contains now an original string.
• Corrected attributes type in the filter() function of the sources loader option.
• Pass correct entry data in the template when the same template used for many pages with different data, in serve mode.
• Removed unused isEntry property from the info argument of the postprocess callback.
  The isEntry property was always true, because template is defined as an entrypoint.