Webpack Manifest Resource Plugin

4.2.7 verified Fri May 01 auth: no javascript

Normalizes JS/CSS resource dependencies for webpack-manifest-plugin. Version 4.2.7. Integrates with CommonsChunkPlugin to track chunk dependencies. Produces a manifest with a 'deps' field mapping entry points to their JS and CSS assets. Supports all webpack-manifest-plugin options.

Common errors

error Error: Cannot find module 'webpack-manifest-resource-plugin' ↓

cause Plugin not installed or missing dependency.

fix

Run: npm install --save-dev webpack-manifest-resource-plugin

error TypeError: ManifestPlugin is not a constructor ↓

cause Using import instead of require.

fix

Use: const ManifestPlugin = require('webpack-manifest-resource-plugin');

error Error: Cannot find module 'webpack-manifest-plugin' ↓

cause webpack-manifest-plugin is a peer dependency not installed.

fix

Run: npm install --save-dev webpack-manifest-plugin

Warnings

gotcha Requires webpack-manifest-plugin to be installed separately. ↓

fix Install webpack-manifest-plugin: npm install --save-dev webpack-manifest-plugin

gotcha CommonsChunkPlugin is deprecated in webpack 4+. Use SplitChunksPlugin instead. ↓

fix Migrate to SplitChunksPlugin; plugin may not work as expected with webpack 4+.

gotcha Only supports CJS require; ESM import not available. ↓

fix Use require('webpack-manifest-resource-plugin')

Install

npm install webpack-manifest-resource-plugin

yarn add webpack-manifest-resource-plugin

pnpm add webpack-manifest-resource-plugin

Imports

ManifestPlugin

wrong

import ManifestPlugin from 'webpack-manifest-resource-plugin';

correct

const ManifestPlugin = require('webpack-manifest-resource-plugin');

CJS only. No default export. Use require.

ManifestPlugin
wrong
```
new webpackManifestResourcePlugin()
```
correct
```
new ManifestPlugin()
```
Constructor is called as a class. No other naming.

Quickstart

Shows basic usage with CommonsChunkPlugin option.

// webpack.config.js
const ManifestPlugin = require('webpack-manifest-resource-plugin');

module.exports = {
  entry: { main: './src/index.js' },
  output: { filename: '[name].[hash].js' },
  plugins: [
    new ManifestPlugin({
      commonsChunk: ['vendor']
    })
  ]
};