replace-webpack-plugin

0.1.2 verified Sat Apr 25 auth: no javascript deprecated

A Webpack plugin to replace content blocks in HTML files using comment markers. Version 0.1.2 is the latest stable release, with no further updates since 2017. It allows replacing named blocks (` ... `) with provided strings, and also supports replacing a placeholder with the Webpack entry hash. Intended for simple HTML injection during builds, but it is a very old plugin with known limitations: it does not support Webpack 4+ or async operations, and the GitHub repository is archived. For modern projects, consider `html-webpack-plugin` with its template features instead.

Common errors

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

cause Package not installed or npm install failed.

fix

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

error Cannot read property 'options' of undefined ↓

cause Plugin instantiated without new keyword or imported incorrectly.

fix

Use: const ReplacePlugin = require('replace-webpack-plugin'); new ReplacePlugin({...})

error webpack: TypeError: plugin.apply is not a function ↓

cause Using an older version of the plugin with Webpack 4+ that no longer supports old plugin API.

fix

Downgrade to webpack 3 or upgrade to a compatible replacement.

Warnings

deprecated Package is unmaintained since 2017 and does not support Webpack 4+ or async hooks. ↓

fix Migrate to html-webpack-plugin with custom templates or use a modern replacement like @dexbyte/replace-webpack-plugin.

gotcha The `skip` option must be a Boolean; any truthy value (e.g., 'false' string) will skip replacement. ↓

fix Use Boolean check: skip: process.env.NODE_ENV === 'development'.

breaking Plugin uses synchronous file operations; it will fail if the entry file does not exist at build time. ↓

fix Ensure the entry file path is correct relative to the webpack context.

Install

npm install replace-webpack-plugin

yarn add replace-webpack-plugin

pnpm add replace-webpack-plugin

Imports

ReplacePlugin

wrong

import ReplacePlugin from 'replace-webpack-plugin';

correct

const ReplacePlugin = require('replace-webpack-plugin');

The package v0.1.2 only supports CommonJS require, not ES modules.

default

wrong

const { ReplacePlugin } = require('replace-webpack-plugin');

correct

const ReplacePlugin = require('replace-webpack-plugin');

The exported object is the constructor itself; destructuring will yield undefined.

ReplacePlugin
wrong
```
new ReplacePlugin.default({...})
```
correct
```
new ReplacePlugin({...})
```
No .default property; direct instantiation of the required object works.

Quickstart

Configures ReplacePlugin in a Webpack 3 build to replace CSS and JS blocks in index.html and substitute [hash] placeholder.

// webpack.config.js
const ReplacePlugin = require('replace-webpack-plugin');

module.exports = {
  entry: './src/index.js',
  output: {
    path: './build',
    filename: 'bundle.js'
  },
  plugins: [
    new ReplacePlugin({
      skip: false,
      entry: 'index.html',
      hash: '[hash]',
      output: '/build/index.html',
      data: {
        css: '<link rel="stylesheet" href="styles.css">',
        js: '<script src="bundle.js"></script>'
      }
    })
  ]
};