chunk-rename-webpack-plugin

1.1.1 verified Sat Apr 25 auth: no javascript deprecated

Webpack plugin (v1.1.1, last released 2017) that overrides output.filename and output.chunkFilename on a per-chunk basis. It maps chunk names to custom filename templates, allowing some files to have static names while others include hashes. Works with webpack 1, 2, and 3 (Node 4+). Not maintained for webpack 4+ — consider webpack's built-in asset module or other plugins. Differentiator: simple, explicit mapping of chunk names to filenames without affecting global output config.

Common errors

error Error: ChunkRenamePlugin is not a constructor ↓

cause Using import statement (ESM) with a CommonJS-only package.

fix

Replace 'import ChunkRenamePlugin from ...' with 'const ChunkRenamePlugin = require(...)'

error Module not found: Error: Can't resolve 'chunk-rename-webpack-plugin' ↓

cause Package not installed or wrong webpack version (4/5).

fix

Run 'npm install chunk-rename-webpack-plugin --save-dev' or downgrade webpack to 1-3.

error Unhandled rejection: TypeError: Cannot read property 'getModules' of undefined ↓

cause Using plugin with webpack 4+ (API mismatch).

fix

Use webpack 1-3 or a compatible plugin like 'webpack-files-archive-plugin'.

Warnings

deprecated Package not updated since 2017; incompatible with webpack 4 and 5. ↓

fix Migrate to webpack's built-in output.filename function or asset module rules.

gotcha Chunk names must exactly match entry keys or async chunk names; case-sensitive. ↓

fix Verify chunk name spelling in webpack output (e.g., 'login' not 'Login').

gotcha Only works with webpack 1, 2, 3; requires Node >= 4. ↓

fix Use compatible webpack version or find alternative for newer webpack.

breaking Removes the ability to use [contenthash] or [fullhash] placeholders from webpack 4/5. ↓

fix Use webpack 4/5 native hashing in output.filename function.

Install

npm install chunk-rename-webpack-plugin

yarn add chunk-rename-webpack-plugin

pnpm add chunk-rename-webpack-plugin

Imports

default

wrong

import ChunkRenamePlugin from 'chunk-rename-webpack-plugin';

correct

const ChunkRenamePlugin = require('chunk-rename-webpack-plugin');

Package uses CommonJS, no default export. Use require().

ChunkRenamePlugin
```
const { ChunkRenamePlugin } = require('chunk-rename-webpack-plugin');
```
Named import works but unnecessary; the package exports a single constructor.
Plugin usage
wrong
```
new ChunkRenamePlugin({ pattern: /.../ })
```
correct
```
new ChunkRenamePlugin({ chunkName: 'filename.js' })
```
Argument is a plain object mapping chunk names to filename templates, not regex or string.

Quickstart

Shows how to override global filename patterns for specific chunks using the plugin.

const path = require('path');
const ChunkRenamePlugin = require('chunk-rename-webpack-plugin');

module.exports = {
  entry: {
    init: './src/init.js',
    vendor: './src/vendor.js',
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name]-[chunkhash].js',
    chunkFilename: 'chunk-[name]-[chunkhash].js',
  },
  plugins: [
    new ChunkRenamePlugin({
      init: 'init.js',
      login: 'chunk-[name]-page.js',
    }),
  ],
};