unplugin-replace

🍣 A universal bundler plugin which replaces targeted strings in files, based on @rollup/plugin-replace.

Installation

# npm
npm i -D unplugin-replace

# jsr
npx jsr add -D @unplugin/replace

Vite

// vite.config.ts
import Replace from 'unplugin-replace/vite'

export default defineConfig({
  plugins: [Replace()],
})

Rollup

// rollup.config.js
import Replace from 'unplugin-replace/rollup'

export default {
  plugins: [Replace()],
}

esbuild

// esbuild.config.js
import { build } from 'esbuild'

build({
  plugins: [require('unplugin-replace/esbuild')()],
})

Webpack

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [require('unplugin-replace/webpack')()],
}

Usage

Options

For all options please refer to docs.

This plugin accepts all @rollup/plugin-replace options, and some extra options that are specific to this plugin.

options.values

• Type: { [find: string]: Replacement } | ReplaceItem[]
• Default: []

type ReplaceItem = {
  /** Supply a string or RegExp to find what you are looking for. */
  find: string | RegExp

  /**
   * Can be a string or a function.
   * - If it's a string, it will replace the substring matched by pattern. A number of special replacement patterns are supported
   * - If it's a function, it will be invoked for every match and its return value is used as the replacement text.
   */
  replacement: Replacement
}
type Replacement = string | ((id: string, match: RegExpExecArray) => string)

Comparing with @rollup/plugin-replace, find option supports regex pattern.

Example:

Replace({
  values: [
    {
      find: /apples/gi,
      replacement: 'oranges',
    },
    {
      find: 'process.env.NODE_ENV',
      replacement: '"production"',
    },
  ],
})

Sponsors

License

MIT License © 2024-PRESENT 三咲智子