0
# Webpack Assets Manifest
1

2
Webpack Assets Manifest is a Webpack plugin that generates JSON manifest files mapping original asset filenames to their hashed versions. It provides extensive customization options through hooks, supports entrypoint tracking with preload/prefetch assets, includes subresource integrity hash generation, and offers both ESM and CommonJS exports with full TypeScript support.
3

4
## Package Information
5

6
- **Package Name**: webpack-assets-manifest
7
- **Package Type**: npm
8
- **Language**: TypeScript
9
- **Installation**: `npm install webpack-assets-manifest -D`
10

11
## Core Imports
12

13
```typescript
14
import { WebpackAssetsManifest } from "webpack-assets-manifest";
15
```
16

17
For CommonJS:
18

19
```javascript
20
const { WebpackAssetsManifest } = require("webpack-assets-manifest");
21
```
22

23
Type imports:
24

25
```typescript
26
import type { Options, AssetsStorage, KeyValuePair, UnknownRecord, JsonStringifyReplacer, JsonStringifySpace } from "webpack-assets-manifest";
27
```
28

29
Subpath imports:
30

31
```typescript
32
import { getSRIHash } from "webpack-assets-manifest/helpers";
33
import { isObject, isKeyValuePair, isPropertyKey } from "webpack-assets-manifest/type-predicate";
34
import { optionsSchema } from "webpack-assets-manifest/options-schema";
35
import type { AssetsStorage, KeyValuePair } from "webpack-assets-manifest/types";
36
```
37

38
## Basic Usage
39

40
```typescript
41
import { WebpackAssetsManifest } from "webpack-assets-manifest";
42

43
// In your webpack configuration
44
export default {
45
  plugins: [
46
    new WebpackAssetsManifest({
47
      output: "assets-manifest.json",
48
      enabled: true,
49
      writeToDisk: true,
50
      sortManifest: true,
51
    }),
52
  ],
53
};
54
```
55

56
## Architecture
57

58
The plugin consists of several key components:
59

60
- **WebpackAssetsManifest Class**: Main plugin implementing WebpackPluginInstance
61
- **Hook System**: Tapable-based hooks for customization (apply, customize, transform, done)
62
- **Asset Processing**: Handles webpack asset analysis and manifest generation
63
- **Type System**: Complete TypeScript definitions for all APIs
64

65
## Capabilities
66

67
### Plugin Configuration
68

69
Core plugin configuration and initialization with comprehensive options for manifest generation, asset processing, and output customization.
70

71
```typescript { .api }
72
class WebpackAssetsManifest {
73
  constructor(options?: Partial<Options>);
74
  apply(compiler: Compiler): void;
75
  
76
  // Getter properties
77
  get defaultOptions(): Options;
78
  get isMerging(): boolean;
79
  get utils(): {
80
    isKeyValuePair: typeof isKeyValuePair;
81
    isObject: typeof isObject;
82
    getSRIHash: typeof getSRIHash;
83
  };
84
}
85

86
interface Options {
87
  enabled: boolean;
88
  assets: AssetsStorage;
89
  output: string;
90
  replacer: JsonStringifyReplacer;
91
  space: JsonStringifySpace;
92
  writeToDisk: boolean | 'auto';
93
  fileExtRegex: RegExp | false;
94
  sortManifest: boolean | ((left: string, right: string) => number);
95
  merge: boolean | 'customize';
96
  publicPath?: string | boolean | ((filename: string, manifest: WebpackAssetsManifest) => string);
97
  contextRelativeKeys: boolean;
98
  entrypoints: boolean;
99
  entrypointsKey: string | false;
100
  entrypointsUseAssets: boolean;
101
  integrity: boolean;
102
  integrityHashes: string[];
103
  integrityPropertyName: string;
104
  extra: Record<PropertyKey, unknown>;
105
  apply?: (manifest: WebpackAssetsManifest) => void;
106
  customize?: (entry: KeyValuePair | false | undefined | void, original: KeyValuePair, manifest: WebpackAssetsManifest, asset?: Asset) => KeyValuePair | false | undefined | void;
107
  done?: (manifest: WebpackAssetsManifest, stats: Stats) => Promise<void>;
108
  transform?: (assets: AssetsStorage, manifest: WebpackAssetsManifest) => AssetsStorage;
109
}
110
```
111

112
[Plugin Configuration](./plugin-configuration.md)
113

114
### Asset Management
115

116
Programmatic interface for managing manifest entries with methods for adding, retrieving, updating, and deleting asset mappings.
117

118
```typescript { .api }
119
class WebpackAssetsManifest {
120
  set(key: AssetsStorageKey, value: AssetsStorageValue): this;
121
  setRaw(key: AssetsStorageKey, value: AssetsStorageValue): this;
122
  get(key: AssetsStorageKey, defaultValue?: AssetsStorageValue): AssetsStorageValue | undefined;
123
  has(key: AssetsStorageKey): boolean;
124
  delete(key: AssetsStorageKey): boolean;
125
  clear(): void;
126
}
127
```
128

129
[Asset Management](./asset-management.md)
130

131
### Hook System
132

133
Tapable-based hook system for customizing manifest generation at various stages of the webpack compilation process.
134

135
```typescript { .api }
136
interface WebpackAssetsManifest {
137
  hooks: {
138
    apply: SyncHook<[manifest: WebpackAssetsManifest]>;
139
    customize: SyncWaterfallHook<[entry: KeyValuePair | false | undefined | void, original: KeyValuePair, manifest: WebpackAssetsManifest, asset: Asset | undefined]>;
140
    transform: SyncWaterfallHook<[asset: AssetsStorage, manifest: WebpackAssetsManifest]>;
141
    done: AsyncSeriesHook<[manifest: WebpackAssetsManifest, stats: Stats]>;
142
    options: SyncWaterfallHook<[options: Options]>;
143
    afterOptions: SyncHook<[options: Options, manifest: WebpackAssetsManifest]>;
144
  };
145
}
146
```
147

148
[Hook System](./hooks.md)
149

150
### Utility Functions
151

152
Helper functions for type checking, SRI hash generation, and data processing available both as standalone imports and through the plugin's utils property.
153

154
```typescript { .api }
155
function getSRIHash(algorithm: string, content: string | BinaryLike): string;
156
function isObject<T extends object = UnknownRecord>(input: unknown): input is T;
157
function isKeyValuePair(input: unknown): input is KeyValuePair;
158
function isPropertyKey(input: unknown): input is PropertyKey;
159
```
160

161
[Utility Functions](./utilities.md)
162

163
## Types
164

165
```typescript { .api }
166
type AssetsStorage = Record<string | number, any>;
167
type AssetsStorageKey = keyof AssetsStorage;
168
type AssetsStorageValue = AssetsStorage[AssetsStorageKey];
169

170
type KeyValuePair<K extends AssetsStorageKey = AssetsStorageKey, V extends AssetsStorageValue = AssetsStorageValue> =
171
  | { key: K; value: V; }
172
  | { key: K; value?: V; }
173
  | { key?: K; value: V; };
174

175
type JsonStringifyReplacer = ((this: any, key: string, value: any) => any) | (string | number)[] | null | undefined;
176
type JsonStringifySpace = Parameters<JSON['stringify']>[2];
177

178
type UnknownRecord = Record<PropertyKey, unknown>;
179
```