@guanghechen/rollup-plugin-copy

This project is modified from https://github.com/vladshcherbin/rollup-plugin-copy. (Migrated from https://www.npmjs.com/package/@barusu/rollup-plugin-copy).

A few months ago I submitted a pr that supports watch mode, but no response was received, so I decided to release it separately.

Install

• npm

  npm install --save-dev @guanghechen/rollup-plugin-copy

• pnpm

  pnpm add -D @guanghechen/rollup-plugin-copy

Usage

// rollup.config.js
import copy from '@guanghechen/rollup-plugin-copy'

export default {
  input: 'src/index.js',
  output: {
    file: 'dist/app.js',
    format: 'cjs'
  },
  plugins: [
    copy({
      targets: [
        { src: 'src/index.html', dest: 'dist/public' },
        { src: ['assets/fonts/arial.woff', 'assets/fonts/arial.woff2'], dest: 'dist/public/fonts' },
        { src: 'assets/images/**/*', dest: 'dist/public/images' }
      ]
    })
  ]
}

Configuration

There are some useful options:

targets

Type: Array | Default: []

Array of targets to copy. A target is an object with properties:

• src (string|string[]): Path or glob of what to copy

• dest (string|string[]): One or more destinations where to copy

• rename (string | Function): Change destination file or folder name

  function rename(
    name: string,
    ext: string,
    srcPath: string,
  ): string

• transform (Function): Modify file contents

  function transform(
    content: string | ArrayBuffer,
    srcPath: string,
    dstPath: string,
  ): Promise<string | ArrayBuffer>

• copyOnce (boolean|undefined): Override the outer option.

• flatten (boolean|undefined): Override the outer option.

• verbose (boolean|undefined): Override the outer option.

• globbyOptions (GlobbyOptions): Override the outer option.

• fsOptions (options of node:fs): Override the outer option.

Each object should have src and dest properties, rename and transform are optional. globby is used inside, check it for glob pattern examples.

File

copy({
  targets: [{ src: 'src/index.html', dest: 'dist/public' }]
})

Folder

copy({
  targets: [{ src: 'assets/images', dest: 'dist/public' }]
})

Glob

copy({
  targets: [{ src: 'assets/*', dest: 'dist/public' }]
})

Glob: multiple items

copy({
  targets: [{ src: ['src/index.html', 'src/styles.css', 'assets/images'], dest: 'dist/public' }]
})

Glob: negated patterns

copy({
  targets: [{ src: ['assets/images/**/*', '!**/*.gif'], dest: 'dist/public/images' }]
})

Multiple targets

copy({
  targets: [
    { src: 'src/index.html', dest: 'dist/public' },
    { src: 'assets/images/**/*', dest: 'dist/public/images' }
  ]
})

Multiple destinations

copy({
  targets: [{ src: 'src/index.html', dest: ['dist/public', 'build/public'] }]
})

Rename with a string

copy({
  targets: [{ src: 'src/app.html', dest: 'dist/public', rename: 'index.html' }]
})

Rename with a function

• Rename filename

  copy({
    targets: [{
      src: 'assets/docs/*',
      dest: 'dist/public/docs',
      rename: (name, extension) => `${name}-v1.${extension}`
    }]
  })
  // assets/docs/a/b.md ==> dist/public/docs/a/b-v1.md

• Rename filepath

  copy({
    targets: [{
      src: 'assets/docs/*',
      dest: 'dist/public/docs',
      rename: (name, extension, srcPath) => 
        path.join(path.relative('assets', path.dirname(srcPath)), `${name}-v1.${extension}`)
    }]
  })
  // assets/docs/a/b.md ==> dist/public/docs/docs/a/b-v1.md

Transform file contents

copy({
  targets: [{
    src: 'src/index.html',
    dest: 'dist/public',
    transform: (contents, srcPath, destPath) => (
      contents.toString()
        .replace('__SCRIPT__', 'app.js')
        .replace('__SOURCE_FILE_PATH__', srcPath)
        .replace('__TARGET_FILE_NAME__', path.basename(srcPath))
    )
  }]
})

verbose

Type: boolean | Default: false

Output copied items to console.

copy({
  targets: [{ src: 'assets/*', dest: 'dist/public' }],
  verbose: true
})

hook

Type: string | Default: buildEnd

Rollup hook the plugin should use. By default, plugin runs when rollup has finished bundling, before bundle is written to disk.

copy({
  targets: [{ src: 'assets/*', dest: 'dist/public' }],
  hook: 'writeBundle'
})

watchHook

Type: string | Default: buildStart

Rollup hook the this.addWatchFile should call. By default, addWatchFile called on each rollup.rollup build. Only be used in hooks during the build phase, i.e. in buildStart, load, resolveId, and transform.

copy({
  targets: [{ src: 'assets/*', dest: 'dist/public' }],
  watchHook: 'resolveId'
})

copyOnce

Type: boolean | Default: false

Copy items once. Useful in watch mode.

copy({
  targets: [{ src: 'assets/*', dest: 'dist/public' }],
  copyOnce: true
})

flatten

Type: boolean | Default: true

Remove the directory structure of copied files.

copy({
  targets: [{ src: 'assets/**/*', dest: 'dist/public' }],
  flatten: false
})

globbyOptions

See globby

copy({
  targets: [{ src: 'src/assets/**/*.js', dest: 'dist' }],
  globbyOptions: {
    ignore: ['**/asset-1.js'],
  },
})

fsOptions

copy({
  targets: [{ src: 'src/assets/**/*.js', dest: 'dist' }],
  fsOptions: {
    copy: {} // Options of 'node:fs'.copy
    writeFile: { // Options of 'node:fs'.outputFile
      encoding: 'utf-8'
    }
  }
})

Thanks Original Authors

• Cédric Meuter
• vladshcherbin

Related

• @guanghechen/rollup-config