Registry / devops / replace-in-file-webpack-plugin

replace-in-file-webpack-plugin

library1.0.6jsnpmunverified

A webpack plugin that replaces strings in files after the compilation is done. Version 1.0.6 (latest) provides a simple API to define replacement rules for files in specified directories, supporting both string and regex patterns with string or function replacements. It is useful for modifying output files (HTML, CSS, JS) that are not processed by loaders. Compared to alternatives like string-replace-webpack-plugin, it offers a cleaner configuration with an array of rule sets and supports multiple file matching via `files` or `test` patterns.

devops

npm install replace-in-file-webpack-plugin

github ↗package ↗

INSTALL

IMPORT

SIG · REPLACE-IN-FILE-WE

replace-in-file-webpack-plugin

devopsjavascriptv1.0.6

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

ReplaceInFileWebpackPlugin

✓ import ReplaceInFileWebpackPlugin from 'replace-in-file-webpack-plugin'

✗ const { ReplaceInFileWebpackPlugin } = require('replace-in-file-webpack-plugin')

Default export; named import will fail.

ReplaceInFileWebpackPlugin

✓ const ReplaceInFileWebpackPlugin = require('replace-in-file-webpack-plugin')

✗ const ReplaceInFileWebpackPlugin = require('replace-in-file-webpack-plugin').default

CommonJS require works without .default.

Shows how to configure the plugin in webpack.config.js to replace placeholders in output files.

// webpack.config.js const path = require('path'); const ReplaceInFileWebpackPlugin = require('replace-in-file-webpack-plugin'); module.exports = { entry: './src/index.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js', }, plugins: [ new ReplaceInFileWebpackPlugin([ { dir: 'dist', files: ['index.html'], rules: [ { search: '{{VERSION}}', replace: '1.0.0' }, { search: /@year/g, replace: '2024' }, ], }, ]), ], };

Debug

Known issues

gotchaThe `replace` option in rules can be a string or function, but if the function returns a non-string value (e.g., undefined), it will be converted to the string 'undefined'.

fix

Ensure replace functions always return a string.

affects: >=0.0.0

gotchaIf both `files` and `test` are omitted, no files will be processed. The plugin requires at least one of these to specify target files.

fix

Provide either `files` (array of filenames) or `test` (regex or array of regexes) in each config object.

affects: >=0.0.0

gotchaThe plugin does not support glob patterns in `files`; only exact filenames are matched.

fix

Use `test` with regex if you need pattern matching, or list all filenames explicitly.

affects: >=0.0.0

Errors

Common errors & fixes

TypeError: ReplaceInFileWebpackPlugin is not a constructor

Importing the plugin incorrectly, e.g., destructuring a named export that doesn't exist.

fix

Use `const ReplaceInFileWebpackPlugin = require('replace-in-file-webpack-plugin');` or `import ReplaceInFileWebpackPlugin from 'replace-in-file-webpack-plugin';`

Error: Cannot find module 'replace-in-file-webpack-plugin'

Package not installed or missing from node_modules.

fix

Run `npm install replace-in-file-webpack-plugin --save-dev`

Error: The provided value must be an array of configurations

Passing a single config object instead of an array.

fix

Wrap your config in an array: `new ReplaceInFileWebpackPlugin([{ ... }])`

Upgrade

Version history

1.0.6latest on npm

Audit

Dependencies

webpackrequiredPeer dependency; plugin hooks into webpack's compiler lifecycle.

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/oyslin/replace-in-file-webpack-plugin ↗

packagehttps://www.npmjs.com/package/replace-in-file-webpack-plugin ↗