Naan and Paneer Makhani

    copy-webpack-plugin-hash

    6.0.0 • Public • Published

    npm node deps test coverage chat

    Copy Webpack Plugin

    Copies individual files or entire directories to the build directory

    Install

    npm i -D copy-webpack-plugin

    Usage

    webpack.config.js

    const CopyWebpackPlugin = require('copy-webpack-plugin')
     
    const config = {
      plugins: [
        new CopyWebpackPlugin([ ...patterns ], options)
      ]
    }

    ℹ️ If you must have webpack-dev-server write files to output directory during development, you can force it with the write-file-webpack-plugin.

    Patterns

    A simple pattern looks like this

    { from: 'source', to: 'dest' }

    Or, in case of just a from with the default destination, you can also use a {String} as shorthand instead of an {Object}

    'source'
    Name Type Default Description
    from {String\|Object} undefined Globs accept minimatch options
    fromArgs {Object} { cwd: context } See the node-glob options in addition to the ones below
    to {String\|Object} undefined Output root if from is file or dir, resolved glob path if from is glob
    toType {String} `` toType Options
    test {RegExp} `` Pattern for extracting elements to be used in to templates
    force {Boolean} false Overwrites files already in compilation.assets (usually added by other plugins/loaders)
    ignore {Array} [] Globs to ignore for this pattern
    flatten {Boolean} false Removes all directory references and only copies file names.⚠️ If files have the same name, the result is non-deterministic
    transform {Function\|Promise} (content, path) => content Function or Promise that modifies file contents before copying
    cache {Boolean\|Object} false Enable transform caching. You can use { cache: { key: 'my-cache-key' } } to invalidate the cache
    context {String} options.context \|\| compiler.options.context A path that determines how to interpret the from path

    from

    webpack.config.js

    [
      new CopyWebpackPlugin([
        'relative/path/to/file.ext'
        '/absolute/path/to/file.ext'
        'relative/path/to/dir'
        '/absolute/path/to/dir'
        '**/*'
        { glob: '\*\*/\*', dot: true }
      ], options)
    ]

    to

    webpack.config.js

    [
      new CopyWebpackPlugin([
        { from: '**/*', to: 'relative/path/to/dest/' }
        { from: '**/*', to: '/absolute/path/to/dest/' }
      ], options)
    ]

    toType

    Name Type Default Description
    'dir' {String} undefined If from is directory, to has no extension or ends in '/'
    'file' {String} undefined If to has extension or from is file
    'template' {String} undefined If to contains a template pattern

    'dir'

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: 'path/to/file.txt',
          to: 'directory/with/extension.ext',
          toType: 'dir'
        }
      ], options)
    ]

    'file'

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: 'path/to/file.txt',
          to: 'file/without/extension',
          toType: 'file'
        },
      ], options)
    ]

    'template'

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: 'src/'
          to: 'dest/[name].[hash].[ext]',
          toType: 'template'
        }
      ], options)
    ]

    test

    Defines a {RegExp} to match some parts of the file path. These capture groups can be reused in the name property using [N] placeholder. Note that [0] will be replaced by the entire path of the file, whereas [1] will contain the first capturing parenthesis of your {RegExp} and so on...

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: '*/*',
          to: '[1]-[2].[hash].[ext]',
          test: /([^/]+)\/(.+)\.png$/
        }
      ], options)
    ]

    force

    webpack.config.js

    [
      new CopyWebpackPlugin([
        { from: 'src/**/*' to: 'dest/', force: true }
      ], options)
    ]

    ignore

    webpack.config.js

    [
      new CopyWebpackPlugin([
        { from: 'src/**/*' to: 'dest/', ignore: [ '*.js' ] }
      ], options)
    ]

    flatten

    webpack.config.js

    [
      new CopyWebpackPlugin([
        { from: 'src/**/*', to: 'dest/', flatten: true }
      ], options)
    ]

    transform

    {Function}

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: 'src/*.png',
          to: 'dest/',
          transform (content, path) {
            return optimize(content)
          }
        }
      ], options)
    ]

    {Promise}

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: 'src/*.png',
          to: 'dest/',
          transform (content, path) {
            return Promise.resolve(optimize(content))
          }
      }
      ], options)
    ]

    cache

    webpack.config.js

    [
      new CopyWebpackPlugin([
        {
          from: 'src/*.png',
          to: 'dest/',
          transform (content, path) {
            return optimize(content)
          },
          cache: true
        }
      ], options)
    ]

    context

    webpack.config.js

    [
      new CopyWebpackPlugin([
        { from: 'src/*.txt', to: 'dest/', context: 'app/' }
      ], options)
    ]

    Options

    Name Type Default Description
    debug {String} 'warning' Debug Options
    ignore {Array} [] Array of globs to ignore (applied to from)
    context {String} compiler.options.context A path that determines how to interpret the from path, shared for all patterns
    copyUnmodified {Boolean} false Copies files, regardless of modification when using watch or webpack-dev-server. All files are copied on first build, regardless of this option

    debug

    Name Type Default Description
    'info' {String\|Boolean} false File location and read info
    'debug' {String} false Very detailed debugging info
    'warning' {String} true Only warnings

    'info'

    webpack.config.js

    [
      new CopyWebpackPlugin(
        [ ...patterns ],
        { debug: 'info' }
      )
    ]

    'debug'

    webpack.config.js

    [
      new CopyWebpackPlugin(
        [ ...patterns ],
        { debug: 'debug' }
      )
    ]

    'warning' (default)

    webpack.config.js

    [
      new CopyWebpackPlugin(
        [ ...patterns ],
        { debug: true }
      )
    ]

    ignore

    webpack.config.js

    [
      new CopyWebpackPlugin(
        [ ...patterns ],
        { ignore: [ '*.js', '*.css' ] }
      )
    ]

    context

    webpack.config.js

    [
      new CopyWebpackPlugin(
        [ ...patterns ],
        { context: [ '/app' ] }
      )
    ]

    copyUnmodified

    ℹ️ By default, we only copy modified files during a webpack --watch or webpack-dev-server build. Setting this option to true will copy all files.

    webpack.config.js

    [
      new CopyWebpackPlugin(
        [ ...patterns ],
        { copyUnmodified: true }
      )
    ]

    Maintainers


    Juho Vepsäläinen

    Joshua Wiens

    Michael Ciniawsky

    Alexander Krasnoyarov

    Install

    npm i copy-webpack-plugin-hash

    DownloadsWeekly Downloads

    26

    Version

    6.0.0

    License

    MIT

    Unpacked Size

    46.6 kB

    Total Files

    11

    Last publish

    Collaborators

    • lcxfs1991