Webpack Assets Manifest

6.5.1 verified Sat Apr 25 auth: no javascript

Webpack plugin that generates a JSON manifest mapping original filenames to their hashed output (e.g., main.js → main-9c68d5e8.js). v6.5.1 is the latest stable release, with frequent updates (~monthly). Written in TypeScript, ships its own types. Supports Subresource Integrity (SRI), entrypoint assets, custom sorting, merging, and hooks. A key differentiator is its built-in SRI and entrypoint handling, plus full webpack 5 compatibility. Requires Node >=20.10 and webpack ^5.61. No default export in v6 — use named import.

Common errors

error TypeError: WebpackAssetsManifest is not a constructor ↓

cause Using default import in v6 when only named export exists

fix

import { WebpackAssetsManifest } from 'webpack-assets-manifest'

error Cannot find module 'webpack-assets-manifest' ↓

cause Package not installed or Node.js version below 20.10 (v6 requires >=20.10)

fix

Install with npm install -D webpack-assets-manifest and ensure Node >=20.10

error ValidationError: Invalid options object. 'WebpackAssetsManifest' has an unknown property 'entrypointsUseAssets' ↓

cause Option name typo or used in v5+ (property renamed or removed)

fix

Check valid option names in the schema; use 'entrypointsUseAssets' only for v4, for v5+ use 'entrypoints: true'

Warnings

breaking v6 removed default export; import must use named export `WebpackAssetsManifest` ↓

fix Change `import WebpackAssetsManifest from 'webpack-assets-manifest'` to `import { WebpackAssetsManifest } from 'webpack-assets-manifest'`

breaking v5 changed default output filename to 'assets-manifest.json' (was 'manifest.json') ↓

fix Set `output: 'manifest.json'` explicitly to retain old behavior or update downstream consumers.

deprecated v4 entrypoints structure changed: assets now nested under `assets` property (e.g., `entrypoints.main.assets.js` instead of `entrypoints.main.js`) ↓

fix Update code that reads entrypoints to use the new nested structure.

gotcha Options schema in v5+ does not allow extra properties; typos in option names will throw validation errors ↓

fix Ensure all option names match the documented schema exactly.

gotcha SRI hash generation may produce different hashes than Webpack's built-in SRI plugin due to different hash splitting logic (v6.0.2+) ↓

fix Use consistent hashing algorithm; if exact match needed, consider using webpack's Subresource Integrity plugin directly.

Install

npm install webpack-assets-manifest

yarn add webpack-assets-manifest

pnpm add webpack-assets-manifest

Imports

WebpackAssetsManifest

wrong

const WebpackAssetsManifest = require('webpack-assets-manifest');
// or: import WebpackAssetsManifest from 'webpack-assets-manifest'

correct

import { WebpackAssetsManifest } from 'webpack-assets-manifest'

Since v6, the plugin is a named export, not default. CommonJS users must destructure from module.exports.

WebpackAssetsManifest (CommonJS)

wrong

const WebpackAssetsManifest = require('webpack-assets-manifest').default

correct

const { WebpackAssetsManifest } = require('webpack-assets-manifest')

The default export is removed in v6. Do NOT use .default.

Options type

wrong

import { Options } from 'webpack-assets-manifest' (if not using type-only)

correct

import type { Options } from 'webpack-assets-manifest'

Options is a TypeScript type, not a runtime value. Use type-only import to avoid bundling.

Quickstart

Creates a manifest with integrity and entrypoints, filters out .map files, then accesses entries and SRI hashes after build.

import { WebpackAssetsManifest } from 'webpack-assets-manifest';

const manifestPlugin = new WebpackAssetsManifest({
  output: 'my-assets.json',
  entrypoints: true,
  integrity: true,
  customize(entry, original, utils) {
    if (entry.value && entry.value.match(/\.map$/)) return false; // exclude sourcemaps
    return entry;
  }
});

// In webpack config:
export default {
  plugins: [manifestPlugin]
};

// Access manifest after build:
console.log(manifestPlugin.get('main.js'));
console.log(manifestPlugin.getIntegrity('main.js'));