jantimon/html-webpack-plugin

This system is the html-webpack-plugin, a tool that generates HTML files to serve webpack bundles. It provides extensive configuration options for template rendering, asset injection, and chunk management across multiple entry points. The codebase includes comprehensive examples demonstrating these capabilities with various template engines and modern webpack standards.

11 changes.

This period focused on updating the plugin and its examples to support Webpack 5, including refactoring internal logic for performance and adopting modern asset handling. It also involved adding comprehensive test fixtures, development tooling, and new isomorphic JavaScript examples to demonstrate advanced template and CSS extraction capabilities.

15 changes.

The project focused on updating its example suite to support Webpack 5, including pre-built outputs and modernized configurations for CSS extraction and script loading. This period also involved migrating the test infrastructure from Jasmine to Jest and adding new examples for chunk optimization, manual sorting, and multi-page setups.

The repository now includes configuration files for code quality and development workflows, specifically adding \.cspell.json\ for custom spell-checking, \.editorconfig\ for consistent editor settings, \.eslintrc.js\ for linting rules, \commitlint.config.js\ for commit message validation, and \lint-staged.config.js\ to automate formatting and linting on staged files. Additionally, a \default\_index.ejs\ template file is introduced as the new default HTML template, and a \flow.puml\ file documents the plugin's internal compilation and asset injection sequence.

(repo-wide) · high confidence

A new example demonstrating favicon integration with HtmlWebpackPlugin has been added. This example configures the build to extract CSS using MiniCssExtractPlugin and includes a template that references a favicon file, illustrating how to combine HTML generation with CSS extraction in a webpack setup.

examples/favicon · high confidence

The examples/javascript-advanced directory now includes a complete isomorphic JavaScript example that demonstrates using require statements within JavaScript templates to inject HTML partials and CSS styles. The example utilizes the mini-css-extract-plugin for CSS handling and html-loader for HTML imports, outputting results into version-specific subdirectories (e.g., dist/webpack-4) to support multiple webpack major versions.

examples/javascript-advanced · high confidence

A new example located in the \examples/inline\ directory demonstrates using the Pug template engine for isomorphic rendering, where CSS is extracted and inlined directly into the HTML via the \MiniCssExtractPlugin\ and a custom template. The example includes a \webpack.config.js\ that configures \pug-loader\ and \mini-css-extract-plugin\, along with supporting files (\example.js\, \main.css\, \template.pug\) to show how to load templates on both backend and frontend.

examples/inline · high confidence

The sort-manually example demonstrates how to use the \chunksSortMode: 'manual'\ option in HtmlWebpackPlugin to explicitly control the order in which JavaScript chunks are injected into HTML. The example configures two output files (\first-file.html\ and \second-file.html\) that include specific subsets of entry chunks (a, b, c and a, b, d respectively) in a defined sequence, alongside CSS extraction via MiniCssExtractPlugin.

examples/sort-manually · high confidence

A new multi-page example has been added to demonstrate configuring Webpack for multiple entry points. The example uses a custom webpack configuration that defines 'first' and 'second' entry points, outputting JavaScript and HTML files with names derived from the entry keys (using \[name\] placeholders), and includes basic CSS styling and HTML generation via HtmlWebpackPlugin.

examples/multi-page · high confidence

The advanced JavaScript example now includes a pre-built output directory for Webpack 5. This adds a bundled JavaScript file, a CSS stylesheet, and an HTML entry point that loads the script with the 'defer' attribute, allowing users to see the Webpack 5 build output directly without running the build process themselves.

(repo-wide) · high confidence

The custom-template example now includes a pre-built distribution for Webpack 5, located in the \dist/webpack-5\ directory. This addition provides a \bundle.js\ file generated with the Webpack 5 runtime, a corresponding \styles.css\ file, and an \index.html\ entry point that loads the bundle with the \defer\ attribute, ensuring the example is ready to run with Webpack 5 without requiring local compilation.

examples/custom-template/dist, examples/default/dist · high confidence

Users can now build all provided examples with a single command using the new \build-examples.js\ script, which automatically detects the installed webpack version and applies necessary configuration adjustments (such as \LoaderOptionsPlugin\ and \mode\ settings) for webpack 4+. A new \README.md\ documents the available example directories, including chunk optimization, custom templates, and various loader integrations.

examples · high confidence

A new example in the \examples/template-parameters\ directory demonstrates how to pass custom template parameters to HtmlWebpackPlugin. The example shows passing a plain object (\{ foo: 'bar' }\) to the \templateParameters\ option, which is merged with default values, and includes a commented-out function-based approach for full control over the parameters passed to the EJS template.

examples/template-parameters · high confidence

The examples/html-loader/dist directory now includes a new webpack-5 subdirectory containing the built output files (index.html, about.html, bundle.js, styles.css) for the webpack 5 example. This provides users with a reference implementation showing how the html-loader behaves when used with webpack 5, including the generated HTML structure with defer script loading and bundled assets.

examples/html-loader/dist · high confidence

A new example demonstrating how to configure Webpack's splitChunks plugin to optimize chunk generation without custom configuration logic. The example includes entry points (entryA, entryB) and utility libraries (lib-multiply, lib-sum, lib-concat) that are automatically split into separate chunks (libMath, libText) based on cache group rules. It also shows how to use HtmlWebpackPlugin to inject specific chunks into different HTML files.

examples/chunk-optimization · high confidence

Added a new example in the examples/javascript directory that demonstrates generating an HTML template dynamically using JavaScript. The example uses a custom template.js file to inject content based on whether the code is running in a backend or frontend context (detected via the HTML\_WEBPACK\_PLUGIN variable), and includes support for CSS extraction via mini-css-extract-plugin and asset handling via html-loader.

examples/javascript · high confidence

The project now enforces commit message standards and staged file linting automatically. A new commit-msg hook runs commitlint to validate commit messages, and a pre-commit hook runs lint-staged to check staged files before commits are finalized.

.husky · high confidence

The custom insertion position example has been updated to support Webpack 5, with build artifacts now generated in a version-specific \dist/webpack-5\ directory. The example demonstrates how to use the \inject: false\ option alongside EJS template parameters (\htmlWebpackPlugin.tags.headTags\ and \bodyTags\) to manually control script injection, and the generated output now uses the \defer\ attribute for script loading.

examples/custom-insertion-position · high confidence

The default example has been updated to demonstrate compatibility with Webpack 5. It now dynamically detects the Webpack major version and outputs bundles to a version-specific directory (e.g., dist/webpack-5). The configuration uses Webpack 5's native asset modules for images (type: 'asset/resource') and standard loaders for CSS, ensuring the example works correctly across different Webpack versions.

examples/default · high confidence

The plugin's internal architecture has been restructured to improve performance and maintainability. A new caching mechanism for child compilations has been introduced to optimize build times, and the chunk sorting logic has been extracted into a dedicated module with a new default 'none' mode (previously chunks were sorted by default). Additionally, the default template loader now uses lodash for rendering, and helper utilities for creating and manipulating HTML tag objects have been added to simplify template modifications.

lib · high confidence

The JavaScript example in the examples/javascript/dist/webpack-5 directory has been rebuilt with Webpack 5, resulting in a new bundle.js file that utilizes the Webpack 5 runtime format. The accompanying index.html now includes the script with the defer attribute, and the styles.css file remains unchanged, ensuring the example demonstrates the latest build tooling behavior.

examples/javascript/dist · high confidence

The html-loader example has been refactored to align with current webpack standards. The configuration now utilizes MiniCssExtractPlugin for CSS handling instead of deprecated extract-text plugins, employs asset/resource rules for images, and outputs bundles into version-specific subdirectories (e.g., dist/webpack-5) to support multiple webpack major versions. The example also demonstrates generating multiple HTML pages (index.html and about.html) from a single template.

examples/custom-template, examples/html-loader · high confidence

The isomorphic Pug example in the examples/pug-loader directory has been updated to reflect current best practices. The configuration now uses the mini-css-extract-plugin instead of the deprecated extract-text-webpack-plugin for handling CSS, and leverages Webpack 5's native asset modules for image resources. The example demonstrates loading a Pug template on both the backend and frontend, rendering a dynamic clock with a specific style.

examples/pug-loader · high confidence

The generated HTML and JavaScript bundles in the multi-page example have been updated to reflect Webpack 5 output. The HTML files now include script tags with the 'defer' attribute, and the JavaScript bundles contain the Webpack 5 runtime and module structure, ensuring compatibility with the latest Webpack version.

examples/multi-page/dist · high confidence

The sort-manually example now includes a webpack-5 build output directory, providing generated JavaScript bundles (a.js through e.js) and HTML files that reference scripts with the defer attribute. This change ensures the example demonstrates correct behavior and asset handling under webpack 5, aligning with the project's broader support for the new webpack version.

examples/chunk-optimization/dist, examples/sort-manually/dist · high confidence

The template-parameters example now includes a Webpack 5 build configuration, producing a new bundle.js and an index.html that loads the script with the defer attribute. This updates the example's build tooling to support Webpack 5, ensuring the generated HTML uses modern script loading behavior.

examples/template-parameters/dist · high confidence

Added test fixtures for HTML template and asset generation scenarios; Migrate test suite from Jasmine to Jest.

This update releases html-webpack-plugin version 5.6.8, which includes dependency updates for runtime packages such as html-minifier-terser (^6.0.2), lodash (^4.17.21), and tapable (^2.0.0), alongside dev dependencies like webpack (^5.104.1) and jest (^27.2.5). The package now supports @rspack/core (0.x, 1.x, 2.x) as an optional peer dependency and requires Node.js \>=10.13.0.

(dependencies) · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

• CAI 60 → 65 (+4.6)
• Rubric changed (rubric-2026.09.12 → rubric-2026.09.18) — scores are not directly comparable.

• Code Health 62 → 63 (+0.1)
• Architecture 94 → 95 (+0.9)
• Maturity 67 → 67 (+0.0)
• Readiness 69 → 70 (+0.9)
• Security 52 → 62 (+9.5)

• Dependency hygiene PARTLY measured — npm pinning read, dependency currency not (no pnpm-resolved versions to grade)
• Documentation: no installation or build instructions (README.md)
• Documentation: no usage examples (README.md)
• High CVE: [GHSA redacted] (package-lock.json)
• High CVE: [GHSA redacted] (package-lock.json)

• High CVE: [GHSA redacted] (package-lock.json)
• High CVE: [GHSA redacted] (package-lock.json)
• Outdated (npm): @types/html-minifier-terser
• Outdated (npm): html-minifier-terser
• Outdated (npm): lodash
• Outdated (npm): tapable

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

jantimon/html-webpack-plugin was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.