[6a3a178] | 1 | <div align="center">
|
---|
| 2 | <a href="https://github.com/webpack/webpack">
|
---|
| 3 | <img width="200" height="200"
|
---|
| 4 | src="https://webpack.js.org/assets/icon-square-big.svg">
|
---|
| 5 | </a>
|
---|
| 6 | </div>
|
---|
| 7 |
|
---|
| 8 | [![npm][npm]][npm-url]
|
---|
| 9 | [![node][node]][node-url]
|
---|
| 10 | [![deps][deps]][deps-url]
|
---|
| 11 | [![tests][tests]][tests-url]
|
---|
| 12 | [![cover][cover]][cover-url]
|
---|
| 13 | [![chat][chat]][chat-url]
|
---|
| 14 | [![size][size]][size-url]
|
---|
| 15 |
|
---|
| 16 | # copy-webpack-plugin
|
---|
| 17 |
|
---|
| 18 | Copies individual files or entire directories, which already exist, to the build directory.
|
---|
| 19 |
|
---|
| 20 | ## Getting Started
|
---|
| 21 |
|
---|
| 22 | To begin, you'll need to install `copy-webpack-plugin`:
|
---|
| 23 |
|
---|
| 24 | ```console
|
---|
| 25 | npm install copy-webpack-plugin --save-dev
|
---|
| 26 | ```
|
---|
| 27 |
|
---|
| 28 | Then add the plugin to your `webpack` config. For example:
|
---|
| 29 |
|
---|
| 30 | **webpack.config.js**
|
---|
| 31 |
|
---|
| 32 | ```js
|
---|
| 33 | const CopyPlugin = require("copy-webpack-plugin");
|
---|
| 34 |
|
---|
| 35 | module.exports = {
|
---|
| 36 | plugins: [
|
---|
| 37 | new CopyPlugin({
|
---|
| 38 | patterns: [
|
---|
| 39 | { from: "source", to: "dest" },
|
---|
| 40 | { from: "other", to: "public" },
|
---|
| 41 | ],
|
---|
| 42 | }),
|
---|
| 43 | ],
|
---|
| 44 | };
|
---|
| 45 | ```
|
---|
| 46 |
|
---|
| 47 | > ℹ️ `copy-webpack-plugin` is not designed to copy files generated from the build process; rather, it is to copy files that already exist in the source tree, as part of the build process.
|
---|
| 48 |
|
---|
| 49 | > ℹ️ If you want `webpack-dev-server` to write files to the output directory during development, you can force it with the [`writeToDisk`](https://github.com/webpack/webpack-dev-middleware#writetodisk) option or the [`write-file-webpack-plugin`](https://github.com/gajus/write-file-webpack-plugin).
|
---|
| 50 |
|
---|
| 51 | > ℹ️ You can get the original source filename from [Asset Objects](https://webpack.js.org/api/stats/#asset-objects).
|
---|
| 52 |
|
---|
| 53 | ## Options
|
---|
| 54 |
|
---|
| 55 | The plugin's signature:
|
---|
| 56 |
|
---|
| 57 | **webpack.config.js**
|
---|
| 58 |
|
---|
| 59 | ```js
|
---|
| 60 | const CopyPlugin = require("copy-webpack-plugin");
|
---|
| 61 |
|
---|
| 62 | module.exports = {
|
---|
| 63 | plugins: [
|
---|
| 64 | new CopyPlugin({
|
---|
| 65 | patterns: [
|
---|
| 66 | { from: "source", to: "dest" },
|
---|
| 67 | { from: "other", to: "public" },
|
---|
| 68 | ],
|
---|
| 69 | options: {
|
---|
| 70 | concurrency: 100,
|
---|
| 71 | },
|
---|
| 72 | }),
|
---|
| 73 | ],
|
---|
| 74 | };
|
---|
| 75 | ```
|
---|
| 76 |
|
---|
| 77 | ### Patterns
|
---|
| 78 |
|
---|
| 79 | | Name | Type | Default | Description |
|
---|
| 80 | | :-------------------------------------: | :------------------: | :---------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------------- |
|
---|
| 81 | | [`from`](#from) | `{String}` | `undefined` | Glob or path from where we copy files. |
|
---|
| 82 | | [`to`](#to) | `{String\|Function}` | `compiler.options.output` | Output path. |
|
---|
| 83 | | [`context`](#context) | `{String}` | `options.context \|\| compiler.options.context` | A path that determines how to interpret the `from` path. |
|
---|
| 84 | | [`globOptions`](#globoptions) | `{Object}` | `undefined` | [Options][glob-options] passed to the glob pattern matching library including `ignore` option. |
|
---|
| 85 | | [`filter`](#filter) | `{Function}` | `undefined` | Allows to filter copied assets. |
|
---|
| 86 | | [`toType`](#totype) | `{String}` | `undefined` | Determinate what is `to` option - directory, file or template. |
|
---|
| 87 | | [`force`](#force) | `{Boolean}` | `false` | Overwrites files already in `compilation.assets` (usually added by other plugins/loaders). |
|
---|
| 88 | | [`priority`](#priority) | `{Number}` | `0` | Allows you to specify the copy priority. |
|
---|
| 89 | | [`transform`](#transform) | `{Object}` | `undefined` | Allows to modify the file contents. Enable `transform` caching. You can use `{ transform: {cache: { key: 'my-cache-key' }} }` to invalidate the cache. |
|
---|
| 90 | | [`transformAll`](#transformAll) | `{Function}` | `undefined` | Allows you to modify the contents of multiple files and save the result to one file. |
|
---|
| 91 | | [`noErrorOnMissing`](#noerroronmissing) | `{Boolean}` | `false` | Doesn't generate an error on missing file(s). |
|
---|
| 92 | | [`info`](#info) | `{Object\|Function}` | `undefined` | Allows to add assets info. |
|
---|
| 93 |
|
---|
| 94 | #### `from`
|
---|
| 95 |
|
---|
| 96 | Type: `String`
|
---|
| 97 | Default: `undefined`
|
---|
| 98 |
|
---|
| 99 | Glob or path from where we copy files.
|
---|
| 100 | Globs accept [fast-glob pattern-syntax](https://github.com/mrmlnc/fast-glob#pattern-syntax).
|
---|
| 101 | Glob can only be a `string`.
|
---|
| 102 |
|
---|
| 103 | > ⚠️ Don't use directly `\\` in `from` option if it is a `glob` (i.e `path\to\file.ext`) option because on UNIX the backslash is a valid character inside a path component, i.e., it's not a separator.
|
---|
| 104 | > On Windows, the forward slash and the backward slash are both separators.
|
---|
| 105 | > Instead please use `/`.
|
---|
| 106 |
|
---|
| 107 | **webpack.config.js**
|
---|
| 108 |
|
---|
| 109 | ```js
|
---|
| 110 | module.exports = {
|
---|
| 111 | plugins: [
|
---|
| 112 | new CopyPlugin({
|
---|
| 113 | patterns: [
|
---|
| 114 | "relative/path/to/file.ext",
|
---|
| 115 | "relative/path/to/dir",
|
---|
| 116 | path.resolve(__dirname, "src", "file.ext"),
|
---|
| 117 | path.resolve(__dirname, "src", "dir"),
|
---|
| 118 | "**/*",
|
---|
| 119 | {
|
---|
| 120 | from: "**/*",
|
---|
| 121 | },
|
---|
| 122 | // If absolute path is a `glob` we replace backslashes with forward slashes, because only forward slashes can be used in the `glob`
|
---|
| 123 | path.posix.join(
|
---|
| 124 | path.resolve(__dirname, "src").replace(/\\/g, "/"),
|
---|
| 125 | "*.txt"
|
---|
| 126 | ),
|
---|
| 127 | ],
|
---|
| 128 | }),
|
---|
| 129 | ],
|
---|
| 130 | };
|
---|
| 131 | ```
|
---|
| 132 |
|
---|
| 133 | ##### `For windows`
|
---|
| 134 |
|
---|
| 135 | If you define `from` as absolute file path or absolute folder path on `Windows`, you can use windows path segment (`\\`)
|
---|
| 136 |
|
---|
| 137 | ```js
|
---|
| 138 | module.exports = {
|
---|
| 139 | plugins: [
|
---|
| 140 | new CopyPlugin({
|
---|
| 141 | patterns: [
|
---|
| 142 | {
|
---|
| 143 | from: path.resolve(__dirname, "file.txt"),
|
---|
| 144 | },
|
---|
| 145 | ],
|
---|
| 146 | }),
|
---|
| 147 | ],
|
---|
| 148 | };
|
---|
| 149 | ```
|
---|
| 150 |
|
---|
| 151 | But you should always use forward-slashes in `glob` expressions
|
---|
| 152 | See [fast-glob manual](https://github.com/mrmlnc/fast-glob#how-to-write-patterns-on-windows).
|
---|
| 153 |
|
---|
| 154 | ```js
|
---|
| 155 | module.exports = {
|
---|
| 156 | plugins: [
|
---|
| 157 | new CopyPlugin({
|
---|
| 158 | patterns: [
|
---|
| 159 | {
|
---|
| 160 | // If absolute path is a `glob` we replace backslashes with forward slashes, because only forward slashes can be used in the `glob`
|
---|
| 161 | from: path.posix.join(
|
---|
| 162 | path.resolve(__dirname, "fixtures").replace(/\\/g, "/"),
|
---|
| 163 | "*.txt"
|
---|
| 164 | ),
|
---|
| 165 | },
|
---|
| 166 | ],
|
---|
| 167 | }),
|
---|
| 168 | ],
|
---|
| 169 | };
|
---|
| 170 | ```
|
---|
| 171 |
|
---|
| 172 | The `context` behaves differently depending on what the `from` is (`glob`, `file` or `dir`).
|
---|
| 173 | More [`examples`](#examples)
|
---|
| 174 |
|
---|
| 175 | #### `to`
|
---|
| 176 |
|
---|
| 177 | Type: `String|Function`
|
---|
| 178 | Default: `compiler.options.output`
|
---|
| 179 |
|
---|
| 180 | ##### String
|
---|
| 181 |
|
---|
| 182 | Output path.
|
---|
| 183 |
|
---|
| 184 | > ⚠️ Don't use directly `\\` in `to` (i.e `path\to\dest`) option because on UNIX the backslash is a valid character inside a path component, i.e., it's not a separator.
|
---|
| 185 | > On Windows, the forward slash and the backward slash are both separators.
|
---|
| 186 | > Instead please use `/` or `path` methods.
|
---|
| 187 |
|
---|
| 188 | **webpack.config.js**
|
---|
| 189 |
|
---|
| 190 | ```js
|
---|
| 191 | module.exports = {
|
---|
| 192 | plugins: [
|
---|
| 193 | new CopyPlugin({
|
---|
| 194 | patterns: [
|
---|
| 195 | {
|
---|
| 196 | from: "**/*",
|
---|
| 197 | to: "relative/path/to/dest/",
|
---|
| 198 | },
|
---|
| 199 | {
|
---|
| 200 | from: "**/*",
|
---|
| 201 | to: "/absolute/path/to/dest/",
|
---|
| 202 | },
|
---|
| 203 | {
|
---|
| 204 | from: "**/*",
|
---|
| 205 | to: "[path][name].[contenthash][ext]",
|
---|
| 206 | },
|
---|
| 207 | ],
|
---|
| 208 | }),
|
---|
| 209 | ],
|
---|
| 210 | };
|
---|
| 211 | ```
|
---|
| 212 |
|
---|
| 213 | ##### Function
|
---|
| 214 |
|
---|
| 215 | Allows to modify the writing path.
|
---|
| 216 |
|
---|
| 217 | > ⚠️ Don't return directly `\\` in `to` (i.e `path\to\newFile`) option because on UNIX the backslash is a valid character inside a path component, i.e., it's not a separator.
|
---|
| 218 | > On Windows, the forward slash and the backward slash are both separators.
|
---|
| 219 | > Instead please use `/` or `path` methods.
|
---|
| 220 |
|
---|
| 221 | **webpack.config.js**
|
---|
| 222 |
|
---|
| 223 | ```js
|
---|
| 224 | module.exports = {
|
---|
| 225 | plugins: [
|
---|
| 226 | new CopyPlugin({
|
---|
| 227 | patterns: [
|
---|
| 228 | {
|
---|
| 229 | from: "src/*.png",
|
---|
| 230 | to({ context, absoluteFilename }) {
|
---|
| 231 | return "dest/newPath/[name][ext]";
|
---|
| 232 | },
|
---|
| 233 | },
|
---|
| 234 | ],
|
---|
| 235 | }),
|
---|
| 236 | ],
|
---|
| 237 | };
|
---|
| 238 | ```
|
---|
| 239 |
|
---|
| 240 | **webpack.config.js**
|
---|
| 241 |
|
---|
| 242 | ```js
|
---|
| 243 | module.exports = {
|
---|
| 244 | plugins: [
|
---|
| 245 | new CopyPlugin({
|
---|
| 246 | patterns: [
|
---|
| 247 | {
|
---|
| 248 | from: "src/*.png",
|
---|
| 249 | to({ context, absoluteFilename }) {
|
---|
| 250 | return Promise.resolve("dest/newPath/[name][ext]");
|
---|
| 251 | },
|
---|
| 252 | },
|
---|
| 253 | ],
|
---|
| 254 | }),
|
---|
| 255 | ],
|
---|
| 256 | };
|
---|
| 257 | ```
|
---|
| 258 |
|
---|
| 259 | #### `context`
|
---|
| 260 |
|
---|
| 261 | Type: `String`
|
---|
| 262 | Default: `options.context|compiler.options.context`
|
---|
| 263 |
|
---|
| 264 | A path that determines how to interpret the `from` path.
|
---|
| 265 |
|
---|
| 266 | > ⚠️ Don't use directly `\\` in `context` (i.e `path\to\context`) option because on UNIX the backslash is a valid character inside a path component, i.e., it's not a separator.
|
---|
| 267 | > On Windows, the forward slash and the backward slash are both separators.
|
---|
| 268 | > Instead please use `/` or `path` methods.
|
---|
| 269 |
|
---|
| 270 | **webpack.config.js**
|
---|
| 271 |
|
---|
| 272 | ```js
|
---|
| 273 | module.exports = {
|
---|
| 274 | plugins: [
|
---|
| 275 | new CopyPlugin({
|
---|
| 276 | patterns: [
|
---|
| 277 | {
|
---|
| 278 | from: "src/*.txt",
|
---|
| 279 | to: "dest/",
|
---|
| 280 | context: "app/",
|
---|
| 281 | },
|
---|
| 282 | ],
|
---|
| 283 | }),
|
---|
| 284 | ],
|
---|
| 285 | };
|
---|
| 286 | ```
|
---|
| 287 |
|
---|
| 288 | The `context` option can be an absolute or relative path. If `context` is a relative, then it is converted to absolute based to `compiler.options.context`
|
---|
| 289 |
|
---|
| 290 | Also, `context` indicates how to interpret the search results. Further, he is considered in this role.
|
---|
| 291 |
|
---|
| 292 | To determine the structure from which the found resources will be copied to the destination folder, the `context` option is used.
|
---|
| 293 |
|
---|
| 294 | If `from` is a file, then `context` is equal to the directory in which this file is located. Accordingly, the result will be only the file name.
|
---|
| 295 |
|
---|
| 296 | If `from` is a directory, then `context` is the same as `from` and is equal to the directory itself. In this case, the result will be a hierarchical structure of the found folders and files relative to the specified directory.
|
---|
| 297 |
|
---|
| 298 | If `from` is a glob, then regardless of the `context` option, the result will be the structure specified in the `from` option
|
---|
| 299 |
|
---|
| 300 | More [`examples`](#examples)
|
---|
| 301 |
|
---|
| 302 | #### `globOptions`
|
---|
| 303 |
|
---|
| 304 | Type: `Object`
|
---|
| 305 | Default: `undefined`
|
---|
| 306 |
|
---|
| 307 | Allows to configute the glob pattern matching library used by the plugin. [See the list of supported options][glob-options]
|
---|
| 308 | To exclude files from the selection, you should use [globOptions.ignore option](https://github.com/mrmlnc/fast-glob#ignore)
|
---|
| 309 |
|
---|
| 310 | **webpack.config.js**
|
---|
| 311 |
|
---|
| 312 | ```js
|
---|
| 313 | module.exports = {
|
---|
| 314 | plugins: [
|
---|
| 315 | new CopyPlugin({
|
---|
| 316 | patterns: [
|
---|
| 317 | {
|
---|
| 318 | from: "public/**/*",
|
---|
| 319 | globOptions: {
|
---|
| 320 | dot: true,
|
---|
| 321 | gitignore: true,
|
---|
| 322 | ignore: ["**/file.*", "**/ignored-directory/**"],
|
---|
| 323 | },
|
---|
| 324 | },
|
---|
| 325 | ],
|
---|
| 326 | }),
|
---|
| 327 | ],
|
---|
| 328 | };
|
---|
| 329 | ```
|
---|
| 330 |
|
---|
| 331 | #### `filter`
|
---|
| 332 |
|
---|
| 333 | Type: `Function`
|
---|
| 334 | Default: `undefined`
|
---|
| 335 |
|
---|
| 336 | > ℹ️ To ignore files by path please use the [`globOptions.ignore`](#globoptions) option.
|
---|
| 337 |
|
---|
| 338 | **webpack.config.js**
|
---|
| 339 |
|
---|
| 340 | ```js
|
---|
| 341 | const fs = require("fs").promise;
|
---|
| 342 |
|
---|
| 343 | module.exports = {
|
---|
| 344 | plugins: [
|
---|
| 345 | new CopyPlugin({
|
---|
| 346 | patterns: [
|
---|
| 347 | {
|
---|
| 348 | from: "public/**/*",
|
---|
| 349 | filter: async (resourcePath) => {
|
---|
| 350 | const data = await fs.promises.readFile(resourcePath);
|
---|
| 351 | const content = data.toString();
|
---|
| 352 |
|
---|
| 353 | if (content === "my-custom-content") {
|
---|
| 354 | return false;
|
---|
| 355 | }
|
---|
| 356 |
|
---|
| 357 | return true;
|
---|
| 358 | },
|
---|
| 359 | },
|
---|
| 360 | ],
|
---|
| 361 | }),
|
---|
| 362 | ],
|
---|
| 363 | };
|
---|
| 364 | ```
|
---|
| 365 |
|
---|
| 366 | #### `toType`
|
---|
| 367 |
|
---|
| 368 | Type: `String`
|
---|
| 369 | Default: `undefined`
|
---|
| 370 |
|
---|
| 371 | Determinate what is `to` option - directory, file or template.
|
---|
| 372 | Sometimes it is hard to say what is `to`, example `path/to/dir-with.ext`.
|
---|
| 373 | If you want to copy files in directory you need use `dir` option.
|
---|
| 374 | We try to automatically determine the `type` so you most likely do not need this option.
|
---|
| 375 |
|
---|
| 376 | | Name | Type | Default | Description |
|
---|
| 377 | | :--------------: | :--------: | :---------: | :--------------------------------------------------------------------------------------------------- |
|
---|
| 378 | | **`'dir'`** | `{String}` | `undefined` | If `to` has no extension or ends on `'/'` |
|
---|
| 379 | | **`'file'`** | `{String}` | `undefined` | If `to` is not a directory and is not a template |
|
---|
| 380 | | **`'template'`** | `{String}` | `undefined` | If `to` contains [a template pattern](https://webpack.js.org/configuration/output/#template-strings) |
|
---|
| 381 |
|
---|
| 382 | ##### `'dir'`
|
---|
| 383 |
|
---|
| 384 | **webpack.config.js**
|
---|
| 385 |
|
---|
| 386 | ```js
|
---|
| 387 | module.exports = {
|
---|
| 388 | plugins: [
|
---|
| 389 | new CopyPlugin({
|
---|
| 390 | patterns: [
|
---|
| 391 | {
|
---|
| 392 | from: "path/to/file.txt",
|
---|
| 393 | to: "directory/with/extension.ext",
|
---|
| 394 | toType: "dir",
|
---|
| 395 | },
|
---|
| 396 | ],
|
---|
| 397 | }),
|
---|
| 398 | ],
|
---|
| 399 | };
|
---|
| 400 | ```
|
---|
| 401 |
|
---|
| 402 | ##### `'file'`
|
---|
| 403 |
|
---|
| 404 | **webpack.config.js**
|
---|
| 405 |
|
---|
| 406 | ```js
|
---|
| 407 | module.exports = {
|
---|
| 408 | plugins: [
|
---|
| 409 | new CopyPlugin({
|
---|
| 410 | patterns: [
|
---|
| 411 | {
|
---|
| 412 | from: "path/to/file.txt",
|
---|
| 413 | to: "file/without/extension",
|
---|
| 414 | toType: "file",
|
---|
| 415 | },
|
---|
| 416 | ],
|
---|
| 417 | }),
|
---|
| 418 | ],
|
---|
| 419 | };
|
---|
| 420 | ```
|
---|
| 421 |
|
---|
| 422 | ##### `'template'`
|
---|
| 423 |
|
---|
| 424 | **webpack.config.js**
|
---|
| 425 |
|
---|
| 426 | ```js
|
---|
| 427 | module.exports = {
|
---|
| 428 | plugins: [
|
---|
| 429 | new CopyPlugin({
|
---|
| 430 | patterns: [
|
---|
| 431 | {
|
---|
| 432 | from: "src/",
|
---|
| 433 | to: "dest/[name].[contenthash][ext]",
|
---|
| 434 | toType: "template",
|
---|
| 435 | },
|
---|
| 436 | ],
|
---|
| 437 | }),
|
---|
| 438 | ],
|
---|
| 439 | };
|
---|
| 440 | ```
|
---|
| 441 |
|
---|
| 442 | #### `force`
|
---|
| 443 |
|
---|
| 444 | Type: `Boolean`
|
---|
| 445 | Default: `false`
|
---|
| 446 |
|
---|
| 447 | Overwrites files already in `compilation.assets` (usually added by other plugins/loaders).
|
---|
| 448 |
|
---|
| 449 | **webpack.config.js**
|
---|
| 450 |
|
---|
| 451 | ```js
|
---|
| 452 | module.exports = {
|
---|
| 453 | plugins: [
|
---|
| 454 | new CopyPlugin({
|
---|
| 455 | patterns: [
|
---|
| 456 | {
|
---|
| 457 | from: "src/**/*",
|
---|
| 458 | to: "dest/",
|
---|
| 459 | force: true,
|
---|
| 460 | },
|
---|
| 461 | ],
|
---|
| 462 | }),
|
---|
| 463 | ],
|
---|
| 464 | };
|
---|
| 465 | ```
|
---|
| 466 |
|
---|
| 467 | #### `priority`
|
---|
| 468 |
|
---|
| 469 | Type: `Number`
|
---|
| 470 | Default: `0`
|
---|
| 471 |
|
---|
| 472 | Allows to specify the priority of copying files with the same destination name.
|
---|
| 473 | Files for patterns with higher priority will be copied later.
|
---|
| 474 | To overwrite files, the [`force`](#force) option must be enabled.
|
---|
| 475 |
|
---|
| 476 | **webpack.config.js**
|
---|
| 477 |
|
---|
| 478 | ```js
|
---|
| 479 | module.exports = {
|
---|
| 480 | plugins: [
|
---|
| 481 | new CopyPlugin({
|
---|
| 482 | patterns: [
|
---|
| 483 | // Copied second and will overwrite "dir_2/file.txt"
|
---|
| 484 | {
|
---|
| 485 | from: "dir_1/file.txt",
|
---|
| 486 | to: "newfile.txt",
|
---|
| 487 | force: true,
|
---|
| 488 | priority: 10,
|
---|
| 489 | },
|
---|
| 490 | // Copied first
|
---|
| 491 | {
|
---|
| 492 | from: "dir_2/file.txt",
|
---|
| 493 | to: "newfile.txt",
|
---|
| 494 | priority: 5,
|
---|
| 495 | },
|
---|
| 496 | ],
|
---|
| 497 | }),
|
---|
| 498 | ],
|
---|
| 499 | };
|
---|
| 500 | ```
|
---|
| 501 |
|
---|
| 502 | #### `transform`
|
---|
| 503 |
|
---|
| 504 | Type: `Function|Object`
|
---|
| 505 | Default: `undefined`
|
---|
| 506 |
|
---|
| 507 | Allows to modify the file contents.
|
---|
| 508 |
|
---|
| 509 | ##### `Function`
|
---|
| 510 |
|
---|
| 511 | **webpack.config.js**
|
---|
| 512 |
|
---|
| 513 | ```js
|
---|
| 514 | module.exports = {
|
---|
| 515 | plugins: [
|
---|
| 516 | new CopyPlugin({
|
---|
| 517 | patterns: [
|
---|
| 518 | {
|
---|
| 519 | from: "src/*.png",
|
---|
| 520 | to: "dest/",
|
---|
| 521 | // The `content` argument is a [`Buffer`](https://nodejs.org/api/buffer.html) object, it could be converted to a `String` to be processed using `content.toString()`
|
---|
| 522 | // The `absoluteFrom` argument is a `String`, it is absolute path from where the file is being copied
|
---|
| 523 | transform(content, absoluteFrom) {
|
---|
| 524 | return optimize(content);
|
---|
| 525 | },
|
---|
| 526 | },
|
---|
| 527 | ],
|
---|
| 528 | }),
|
---|
| 529 | ],
|
---|
| 530 | };
|
---|
| 531 | ```
|
---|
| 532 |
|
---|
| 533 | ##### `Object`
|
---|
| 534 |
|
---|
| 535 | | Name | Type | Default | Description |
|
---|
| 536 | | :-------------------------------: | :-----------------: | :---------: | :--------------------------------------------------------------------------------------------------------------- |
|
---|
| 537 | | **[`transformer`](#transformer)** | `{Function}` | `undefined` | Allows to modify the file contents. |
|
---|
| 538 | | **[`cache`](#cache)** | `{Boolean\|Object}` | `false` | Enable `transform` caching. You can use `transform: { cache: { key: 'my-cache-key' } }` to invalidate the cache. |
|
---|
| 539 |
|
---|
| 540 | ###### `transformer`
|
---|
| 541 |
|
---|
| 542 | Type: `Function`
|
---|
| 543 | Default: `undefined`
|
---|
| 544 |
|
---|
| 545 | **webpack.config.js**
|
---|
| 546 |
|
---|
| 547 | ```js
|
---|
| 548 | module.exports = {
|
---|
| 549 | plugins: [
|
---|
| 550 | new CopyPlugin({
|
---|
| 551 | patterns: [
|
---|
| 552 | {
|
---|
| 553 | from: "src/*.png",
|
---|
| 554 | to: "dest/",
|
---|
| 555 | // The `content` argument is a [`Buffer`](https://nodejs.org/api/buffer.html) object, it could be converted to a `String` to be processed using `content.toString()`
|
---|
| 556 | // The `absoluteFrom` argument is a `String`, it is absolute path from where the file is being copied
|
---|
| 557 | transform: {
|
---|
| 558 | transformer(content, absoluteFrom) {
|
---|
| 559 | return optimize(content);
|
---|
| 560 | },
|
---|
| 561 | },
|
---|
| 562 | },
|
---|
| 563 | ],
|
---|
| 564 | }),
|
---|
| 565 | ],
|
---|
| 566 | };
|
---|
| 567 | ```
|
---|
| 568 |
|
---|
| 569 | **webpack.config.js**
|
---|
| 570 |
|
---|
| 571 | ```js
|
---|
| 572 | module.exports = {
|
---|
| 573 | plugins: [
|
---|
| 574 | new CopyPlugin({
|
---|
| 575 | patterns: [
|
---|
| 576 | {
|
---|
| 577 | from: "src/*.png",
|
---|
| 578 | to: "dest/",
|
---|
| 579 | transform: {
|
---|
| 580 | transformer(content, path) {
|
---|
| 581 | return Promise.resolve(optimize(content));
|
---|
| 582 | },
|
---|
| 583 | },
|
---|
| 584 | },
|
---|
| 585 | ],
|
---|
| 586 | }),
|
---|
| 587 | ],
|
---|
| 588 | };
|
---|
| 589 | ```
|
---|
| 590 |
|
---|
| 591 | ###### `cache`
|
---|
| 592 |
|
---|
| 593 | Type: `Boolean|Object`
|
---|
| 594 | Default: `false`
|
---|
| 595 |
|
---|
| 596 | **webpack.config.js**
|
---|
| 597 |
|
---|
| 598 | Enable/disable and configure caching.
|
---|
| 599 | Default path to cache directory: `node_modules/.cache/copy-webpack-plugin`.
|
---|
| 600 |
|
---|
| 601 | ###### `Boolean`
|
---|
| 602 |
|
---|
| 603 | Enables/Disable `transform` caching.
|
---|
| 604 |
|
---|
| 605 | **webpack.config.js**
|
---|
| 606 |
|
---|
| 607 | ```js
|
---|
| 608 | module.exports = {
|
---|
| 609 | plugins: [
|
---|
| 610 | new CopyPlugin({
|
---|
| 611 | patterns: [
|
---|
| 612 | {
|
---|
| 613 | from: "src/*.png",
|
---|
| 614 | to: "dest/",
|
---|
| 615 | transform: {
|
---|
| 616 | transformer(content, path) {
|
---|
| 617 | return optimize(content);
|
---|
| 618 | },
|
---|
| 619 | cache: true,
|
---|
| 620 | },
|
---|
| 621 | },
|
---|
| 622 | ],
|
---|
| 623 | }),
|
---|
| 624 | ],
|
---|
| 625 | };
|
---|
| 626 | ```
|
---|
| 627 |
|
---|
| 628 | ##### `Object`
|
---|
| 629 |
|
---|
| 630 | Enables `transform` caching and setup cache directory and invalidation keys.
|
---|
| 631 |
|
---|
| 632 | **webpack.config.js**
|
---|
| 633 |
|
---|
| 634 | ```js
|
---|
| 635 | module.exports = {
|
---|
| 636 | plugins: [
|
---|
| 637 | new CopyPlugin({
|
---|
| 638 | patterns: [
|
---|
| 639 | {
|
---|
| 640 | from: "src/*.png",
|
---|
| 641 | to: "dest/",
|
---|
| 642 | transform: {
|
---|
| 643 | transformer(content, path) {
|
---|
| 644 | return optimize(content);
|
---|
| 645 | },
|
---|
| 646 | cache: {
|
---|
| 647 | directory: path.resolve(__dirname, "cache-directory"),
|
---|
| 648 | keys: {
|
---|
| 649 | // May be useful for invalidating cache based on external values
|
---|
| 650 | // For example, you can invalid cache based on `process.version` - { node: process.version }
|
---|
| 651 | key: "value",
|
---|
| 652 | },
|
---|
| 653 | },
|
---|
| 654 | },
|
---|
| 655 | },
|
---|
| 656 | ],
|
---|
| 657 | }),
|
---|
| 658 | ],
|
---|
| 659 | };
|
---|
| 660 | ```
|
---|
| 661 |
|
---|
| 662 | You can setup invalidation keys using a function.
|
---|
| 663 |
|
---|
| 664 | Simple function:
|
---|
| 665 |
|
---|
| 666 | **webpack.config.js**
|
---|
| 667 |
|
---|
| 668 | ```js
|
---|
| 669 | module.exports = {
|
---|
| 670 | plugins: [
|
---|
| 671 | new CopyPlugin({
|
---|
| 672 | patterns: [
|
---|
| 673 | {
|
---|
| 674 | from: "src/*.png",
|
---|
| 675 | to: "dest/",
|
---|
| 676 | transform: {
|
---|
| 677 | transformer(content, path) {
|
---|
| 678 | return optimize(content);
|
---|
| 679 | },
|
---|
| 680 | cache: {
|
---|
| 681 | directory: path.resolve(__dirname, "cache-directory"),
|
---|
| 682 | keys: (defaultCacheKeys, absoluteFrom) => {
|
---|
| 683 | const keys = getCustomCacheInvalidationKeysSync();
|
---|
| 684 |
|
---|
| 685 | return {
|
---|
| 686 | ...defaultCacheKeys,
|
---|
| 687 | keys,
|
---|
| 688 | };
|
---|
| 689 | },
|
---|
| 690 | },
|
---|
| 691 | },
|
---|
| 692 | },
|
---|
| 693 | ],
|
---|
| 694 | }),
|
---|
| 695 | ],
|
---|
| 696 | };
|
---|
| 697 | ```
|
---|
| 698 |
|
---|
| 699 | Async function:
|
---|
| 700 |
|
---|
| 701 | **webpack.config.js**
|
---|
| 702 |
|
---|
| 703 | ```js
|
---|
| 704 | module.exports = {
|
---|
| 705 | plugins: [
|
---|
| 706 | new CopyPlugin({
|
---|
| 707 | patterns: [
|
---|
| 708 | {
|
---|
| 709 | from: "src/*.png",
|
---|
| 710 | to: "dest/",
|
---|
| 711 | transform: {
|
---|
| 712 | transformer(content, path) {
|
---|
| 713 | return optimize(content);
|
---|
| 714 | },
|
---|
| 715 | cache: {
|
---|
| 716 | directory: path.resolve(__dirname, "cache-directory"),
|
---|
| 717 | keys: async (defaultCacheKeys, absoluteFrom) => {
|
---|
| 718 | const keys = await getCustomCacheInvalidationKeysAsync();
|
---|
| 719 |
|
---|
| 720 | return {
|
---|
| 721 | ...defaultCacheKeys,
|
---|
| 722 | keys,
|
---|
| 723 | };
|
---|
| 724 | },
|
---|
| 725 | },
|
---|
| 726 | },
|
---|
| 727 | },
|
---|
| 728 | ],
|
---|
| 729 | }),
|
---|
| 730 | ],
|
---|
| 731 | };
|
---|
| 732 | ```
|
---|
| 733 |
|
---|
| 734 | #### `transformAll`
|
---|
| 735 |
|
---|
| 736 | Type: `Function`
|
---|
| 737 | Default: `undefined`
|
---|
| 738 |
|
---|
| 739 | Allows you to modify the contents of multiple files and save the result to one file.
|
---|
| 740 |
|
---|
| 741 | > ℹ️ The `to` option must be specified and point to a file. It is allowed to use only `[contenthash]` and `[fullhash]` template strings.
|
---|
| 742 |
|
---|
| 743 | **webpack.config.js**
|
---|
| 744 |
|
---|
| 745 | ```js
|
---|
| 746 | module.exports = {
|
---|
| 747 | plugins: [
|
---|
| 748 | new CopyPlugin({
|
---|
| 749 | patterns: [
|
---|
| 750 | {
|
---|
| 751 | from: "src/**/*.txt",
|
---|
| 752 | to: "dest/file.txt",
|
---|
| 753 | // The `assets` argument is an assets array for the pattern.from ("src/**/*.txt")
|
---|
| 754 | transformAll(assets) {
|
---|
| 755 | const result = assets.reduce((accumulator, asset) => {
|
---|
| 756 | // The asset content can be obtained from `asset.source` using `source` method.
|
---|
| 757 | // The asset content is a [`Buffer`](https://nodejs.org/api/buffer.html) object, it could be converted to a `String` to be processed using `content.toString()`
|
---|
| 758 | const content = asset.data;
|
---|
| 759 |
|
---|
| 760 | accumulator = `${accumulator}${content}\n`;
|
---|
| 761 | return accumulator;
|
---|
| 762 | }, "");
|
---|
| 763 |
|
---|
| 764 | return result;
|
---|
| 765 | },
|
---|
| 766 | },
|
---|
| 767 | ],
|
---|
| 768 | }),
|
---|
| 769 | ],
|
---|
| 770 | };
|
---|
| 771 | ```
|
---|
| 772 |
|
---|
| 773 | ### `noErrorOnMissing`
|
---|
| 774 |
|
---|
| 775 | Type: `Boolean`
|
---|
| 776 | Default: `false`
|
---|
| 777 |
|
---|
| 778 | Doesn't generate an error on missing file(s);
|
---|
| 779 |
|
---|
| 780 | ```js
|
---|
| 781 | module.exports = {
|
---|
| 782 | plugins: [
|
---|
| 783 | new CopyPlugin({
|
---|
| 784 | patterns: [
|
---|
| 785 | {
|
---|
| 786 | from: path.resolve(__dirname, "missing-file.txt"),
|
---|
| 787 | noErrorOnMissing: true,
|
---|
| 788 | },
|
---|
| 789 | ],
|
---|
| 790 | }),
|
---|
| 791 | ],
|
---|
| 792 | };
|
---|
| 793 | ```
|
---|
| 794 |
|
---|
| 795 | #### `info`
|
---|
| 796 |
|
---|
| 797 | Type: `Object|Function<Object>`
|
---|
| 798 | Default: `undefined`
|
---|
| 799 |
|
---|
| 800 | Allows to add assets info.
|
---|
| 801 |
|
---|
| 802 | **webpack.config.js**
|
---|
| 803 |
|
---|
| 804 | ```js
|
---|
| 805 | module.exports = {
|
---|
| 806 | plugins: [
|
---|
| 807 | new CopyPlugin({
|
---|
| 808 | patterns: [
|
---|
| 809 | "relative/path/to/file.ext",
|
---|
| 810 | {
|
---|
| 811 | from: "**/*",
|
---|
| 812 | // Terser skip this file for minimization
|
---|
| 813 | info: { minimized: true },
|
---|
| 814 | },
|
---|
| 815 | ],
|
---|
| 816 | }),
|
---|
| 817 | ],
|
---|
| 818 | };
|
---|
| 819 | ```
|
---|
| 820 |
|
---|
| 821 | **webpack.config.js**
|
---|
| 822 |
|
---|
| 823 | ```js
|
---|
| 824 | module.exports = {
|
---|
| 825 | plugins: [
|
---|
| 826 | new CopyPlugin({
|
---|
| 827 | patterns: [
|
---|
| 828 | "relative/path/to/file.ext",
|
---|
| 829 | {
|
---|
| 830 | from: "**/*",
|
---|
| 831 | // Terser skip this file for minimization
|
---|
| 832 | info: (file) => ({ minimized: true }),
|
---|
| 833 | },
|
---|
| 834 | ],
|
---|
| 835 | }),
|
---|
| 836 | ],
|
---|
| 837 | };
|
---|
| 838 | ```
|
---|
| 839 |
|
---|
| 840 | ### Options
|
---|
| 841 |
|
---|
| 842 | | Name | Type | Default | Description |
|
---|
| 843 | | :---------------------------: | :--------: | :-----: | :----------------------------------------------- |
|
---|
| 844 | | [`concurrency`](#concurrency) | `{Number}` | `100` | Limits the number of simultaneous requests to fs |
|
---|
| 845 |
|
---|
| 846 | #### `concurrency`
|
---|
| 847 |
|
---|
| 848 | limits the number of simultaneous requests to fs
|
---|
| 849 |
|
---|
| 850 | **webpack.config.js**
|
---|
| 851 |
|
---|
| 852 | ```js
|
---|
| 853 | module.exports = {
|
---|
| 854 | plugins: [
|
---|
| 855 | new CopyPlugin({
|
---|
| 856 | patterns: [...patterns],
|
---|
| 857 | options: { concurrency: 50 },
|
---|
| 858 | }),
|
---|
| 859 | ],
|
---|
| 860 | };
|
---|
| 861 | ```
|
---|
| 862 |
|
---|
| 863 | ### Examples
|
---|
| 864 |
|
---|
| 865 | #### Different variants `from` (`glob`, `file` or `dir`).
|
---|
| 866 |
|
---|
| 867 | Take for example the following file structure:
|
---|
| 868 |
|
---|
| 869 | ```
|
---|
| 870 | src/directory-nested/deep-nested/deepnested-file.txt
|
---|
| 871 | src/directory-nested/nested-file.txt
|
---|
| 872 | ```
|
---|
| 873 |
|
---|
| 874 | ##### From is a Glob
|
---|
| 875 |
|
---|
| 876 | Everything that you specify in `from` will be included in the result:
|
---|
| 877 |
|
---|
| 878 | **webpack.config.js**
|
---|
| 879 |
|
---|
| 880 | ```js
|
---|
| 881 | module.exports = {
|
---|
| 882 | plugins: [
|
---|
| 883 | new CopyPlugin({
|
---|
| 884 | patterns: [
|
---|
| 885 | {
|
---|
| 886 | from: "src/directory-nested/**/*",
|
---|
| 887 | },
|
---|
| 888 | ],
|
---|
| 889 | }),
|
---|
| 890 | ],
|
---|
| 891 | };
|
---|
| 892 | ```
|
---|
| 893 |
|
---|
| 894 | Result:
|
---|
| 895 |
|
---|
| 896 | ```txt
|
---|
| 897 | src/directory-nested/deep-nested/deepnested-file.txt,
|
---|
| 898 | src/directory-nested/nested-file.txt
|
---|
| 899 | ```
|
---|
| 900 |
|
---|
| 901 | If you want only content `src/directory-nested/`, you should only indicate `glob` in `from`. The path to the folder in which the search should take place, should be moved to `context`.
|
---|
| 902 |
|
---|
| 903 | **webpack.config.js**
|
---|
| 904 |
|
---|
| 905 | ```js
|
---|
| 906 | module.exports = {
|
---|
| 907 | plugins: [
|
---|
| 908 | new CopyPlugin({
|
---|
| 909 | patterns: [
|
---|
| 910 | {
|
---|
| 911 | from: "**/*",
|
---|
| 912 | context: path.resolve(__dirname, "src", "directory-nested"),
|
---|
| 913 | },
|
---|
| 914 | ],
|
---|
| 915 | }),
|
---|
| 916 | ],
|
---|
| 917 | };
|
---|
| 918 | ```
|
---|
| 919 |
|
---|
| 920 | Result:
|
---|
| 921 |
|
---|
| 922 | ```txt
|
---|
| 923 | deep-nested/deepnested-file.txt,
|
---|
| 924 | nested-file.txt
|
---|
| 925 | ```
|
---|
| 926 |
|
---|
| 927 | ##### From is a Dir
|
---|
| 928 |
|
---|
| 929 | **webpack.config.js**
|
---|
| 930 |
|
---|
| 931 | ```js
|
---|
| 932 | module.exports = {
|
---|
| 933 | plugins: [
|
---|
| 934 | new CopyPlugin({
|
---|
| 935 | patterns: [
|
---|
| 936 | {
|
---|
| 937 | from: path.resolve(__dirname, "src", "directory-nested"),
|
---|
| 938 | },
|
---|
| 939 | ],
|
---|
| 940 | }),
|
---|
| 941 | ],
|
---|
| 942 | };
|
---|
| 943 | ```
|
---|
| 944 |
|
---|
| 945 | Result:
|
---|
| 946 |
|
---|
| 947 | ```txt
|
---|
| 948 | deep-nested/deepnested-file.txt,
|
---|
| 949 | nested-file.txt
|
---|
| 950 | ```
|
---|
| 951 |
|
---|
| 952 | Technically, this is `**/*` with a predefined context equal to the specified directory.
|
---|
| 953 |
|
---|
| 954 | **webpack.config.js**
|
---|
| 955 |
|
---|
| 956 | ```js
|
---|
| 957 | module.exports = {
|
---|
| 958 | plugins: [
|
---|
| 959 | new CopyPlugin({
|
---|
| 960 | patterns: [
|
---|
| 961 | {
|
---|
| 962 | from: "**/*",
|
---|
| 963 | context: path.resolve(__dirname, "src", "directory-nested"),
|
---|
| 964 | },
|
---|
| 965 | ],
|
---|
| 966 | }),
|
---|
| 967 | ],
|
---|
| 968 | };
|
---|
| 969 | ```
|
---|
| 970 |
|
---|
| 971 | Result:
|
---|
| 972 |
|
---|
| 973 | ```txt
|
---|
| 974 | deep-nested/deepnested-file.txt,
|
---|
| 975 | nested-file.txt
|
---|
| 976 | ```
|
---|
| 977 |
|
---|
| 978 | ##### From is a File
|
---|
| 979 |
|
---|
| 980 | ```js
|
---|
| 981 | module.exports = {
|
---|
| 982 | plugins: [
|
---|
| 983 | new CopyPlugin({
|
---|
| 984 | patterns: [
|
---|
| 985 | {
|
---|
| 986 | from: path.resolve(
|
---|
| 987 | __dirname,
|
---|
| 988 | "src",
|
---|
| 989 | "directory-nested",
|
---|
| 990 | "nested-file.txt"
|
---|
| 991 | ),
|
---|
| 992 | },
|
---|
| 993 | ],
|
---|
| 994 | }),
|
---|
| 995 | ],
|
---|
| 996 | };
|
---|
| 997 | ```
|
---|
| 998 |
|
---|
| 999 | Result:
|
---|
| 1000 |
|
---|
| 1001 | ```txt
|
---|
| 1002 | nested-file.txt
|
---|
| 1003 | ```
|
---|
| 1004 |
|
---|
| 1005 | Technically, this is a filename with a predefined context equal to `path.dirname(pathToFile)`.
|
---|
| 1006 |
|
---|
| 1007 | **webpack.config.js**
|
---|
| 1008 |
|
---|
| 1009 | ```js
|
---|
| 1010 | module.exports = {
|
---|
| 1011 | plugins: [
|
---|
| 1012 | new CopyPlugin({
|
---|
| 1013 | patterns: [
|
---|
| 1014 | {
|
---|
| 1015 | from: "nested-file.txt",
|
---|
| 1016 | context: path.resolve(__dirname, "src", "directory-nested"),
|
---|
| 1017 | },
|
---|
| 1018 | ],
|
---|
| 1019 | }),
|
---|
| 1020 | ],
|
---|
| 1021 | };
|
---|
| 1022 | ```
|
---|
| 1023 |
|
---|
| 1024 | Result:
|
---|
| 1025 |
|
---|
| 1026 | ```txt
|
---|
| 1027 | nested-file.txt
|
---|
| 1028 | ```
|
---|
| 1029 |
|
---|
| 1030 | #### Ignoring files
|
---|
| 1031 |
|
---|
| 1032 | **webpack.config.js**
|
---|
| 1033 |
|
---|
| 1034 | ```js
|
---|
| 1035 | module.exports = {
|
---|
| 1036 | plugins: [
|
---|
| 1037 | new CopyPlugin({
|
---|
| 1038 | patterns: [
|
---|
| 1039 | {
|
---|
| 1040 | from: path.posix.join(
|
---|
| 1041 | path.resolve(__dirname, "src").replace(/\\/g, "/"),
|
---|
| 1042 | "**/*"
|
---|
| 1043 | ),
|
---|
| 1044 | globOptions: {
|
---|
| 1045 | ignore: [
|
---|
| 1046 | // Ignore all `txt` files
|
---|
| 1047 | "**/*.txt",
|
---|
| 1048 | // Ignore all files in all subdirectories
|
---|
| 1049 | "**/subdir/**",
|
---|
| 1050 | ],
|
---|
| 1051 | },
|
---|
| 1052 | },
|
---|
| 1053 | ],
|
---|
| 1054 | }),
|
---|
| 1055 | ],
|
---|
| 1056 | };
|
---|
| 1057 | ```
|
---|
| 1058 |
|
---|
| 1059 | #### Flatten copy
|
---|
| 1060 |
|
---|
| 1061 | Removes all directory references and only copies file names.
|
---|
| 1062 |
|
---|
| 1063 | > ⚠️ If files have the same name, the result is non-deterministic.
|
---|
| 1064 |
|
---|
| 1065 | **webpack.config.js**
|
---|
| 1066 |
|
---|
| 1067 | ```js
|
---|
| 1068 | module.exports = {
|
---|
| 1069 | plugins: [
|
---|
| 1070 | new CopyPlugin({
|
---|
| 1071 | patterns: [
|
---|
| 1072 | {
|
---|
| 1073 | from: "src/**/*",
|
---|
| 1074 | to: "[name][ext]",
|
---|
| 1075 | },
|
---|
| 1076 | ],
|
---|
| 1077 | }),
|
---|
| 1078 | ],
|
---|
| 1079 | };
|
---|
| 1080 | ```
|
---|
| 1081 |
|
---|
| 1082 | Result:
|
---|
| 1083 |
|
---|
| 1084 | ```txt
|
---|
| 1085 | file-1.txt
|
---|
| 1086 | file-2.txt
|
---|
| 1087 | nested-file.txt
|
---|
| 1088 | ```
|
---|
| 1089 |
|
---|
| 1090 | #### Copy in new directory
|
---|
| 1091 |
|
---|
| 1092 | **webpack.config.js**
|
---|
| 1093 |
|
---|
| 1094 | ```js
|
---|
| 1095 | module.exports = {
|
---|
| 1096 | plugins: [
|
---|
| 1097 | new CopyPlugin({
|
---|
| 1098 | patterns: [
|
---|
| 1099 | {
|
---|
| 1100 | // When copying files starting with a dot, must specify the toType option
|
---|
| 1101 | // toType: "file",
|
---|
| 1102 | to({ context, absoluteFilename }) {
|
---|
| 1103 | return `newdirectory/${path.relative(context, absoluteFilename)}`;
|
---|
| 1104 | },
|
---|
| 1105 | from: "directory",
|
---|
| 1106 | },
|
---|
| 1107 | ],
|
---|
| 1108 | }),
|
---|
| 1109 | ],
|
---|
| 1110 | };
|
---|
| 1111 | ```
|
---|
| 1112 |
|
---|
| 1113 | Result:
|
---|
| 1114 |
|
---|
| 1115 | ```txt
|
---|
| 1116 | "newdirectory/file-1.txt",
|
---|
| 1117 | "newdirectory/nestedfile.txt",
|
---|
| 1118 | "newdirectory/nested/deep-nested/deepnested.txt",
|
---|
| 1119 | "newdirectory/nested/nestedfile.txt",
|
---|
| 1120 | ```
|
---|
| 1121 |
|
---|
| 1122 | #### Skip running JavaScript files through a minimizer
|
---|
| 1123 |
|
---|
| 1124 | Useful if you need to simply copy `*.js` files to destination "as is" without evaluating and minimizing them using Terser.
|
---|
| 1125 |
|
---|
| 1126 | **webpack.config.js**
|
---|
| 1127 |
|
---|
| 1128 | ```js
|
---|
| 1129 | module.exports = {
|
---|
| 1130 | plugins: [
|
---|
| 1131 | new CopyPlugin({
|
---|
| 1132 | patterns: [
|
---|
| 1133 | "relative/path/to/file.ext",
|
---|
| 1134 | {
|
---|
| 1135 | from: "**/*",
|
---|
| 1136 | // Terser skip this file for minimization
|
---|
| 1137 | info: { minimized: true },
|
---|
| 1138 | },
|
---|
| 1139 | ],
|
---|
| 1140 | }),
|
---|
| 1141 | ],
|
---|
| 1142 | };
|
---|
| 1143 | ```
|
---|
| 1144 |
|
---|
| 1145 | ##### `yarn workspaces` and `monorepos`
|
---|
| 1146 |
|
---|
| 1147 | When using `yarn workspaces` or` monorepos`, relative copy paths from node_modules can be broken due to the way packages are hoisting.
|
---|
| 1148 | To avoid this, should explicitly specify where to copy the files from using `require.resolve`.
|
---|
| 1149 |
|
---|
| 1150 | **webpack.config.js**
|
---|
| 1151 |
|
---|
| 1152 | ```js
|
---|
| 1153 | module.exports = {
|
---|
| 1154 | plugins: [
|
---|
| 1155 | new CopyPlugin({
|
---|
| 1156 | patterns: [
|
---|
| 1157 | {
|
---|
| 1158 | from: `${path.dirname(
|
---|
| 1159 | require.resolve(`${moduleName}/package.json`)
|
---|
| 1160 | )}/target`,
|
---|
| 1161 | to: "target",
|
---|
| 1162 | },
|
---|
| 1163 | ],
|
---|
| 1164 | }),
|
---|
| 1165 | ],
|
---|
| 1166 | };
|
---|
| 1167 | ```
|
---|
| 1168 |
|
---|
| 1169 | ## Contributing
|
---|
| 1170 |
|
---|
| 1171 | Please take a moment to read our contributing guidelines if you haven't yet done so.
|
---|
| 1172 |
|
---|
| 1173 | [CONTRIBUTING](./.github/CONTRIBUTING.md)
|
---|
| 1174 |
|
---|
| 1175 | ## License
|
---|
| 1176 |
|
---|
| 1177 | [MIT](./LICENSE)
|
---|
| 1178 |
|
---|
| 1179 | [npm]: https://img.shields.io/npm/v/copy-webpack-plugin.svg
|
---|
| 1180 | [npm-url]: https://npmjs.com/package/copy-webpack-plugin
|
---|
| 1181 | [node]: https://img.shields.io/node/v/copy-webpack-plugin.svg
|
---|
| 1182 | [node-url]: https://nodejs.org
|
---|
| 1183 | [deps]: https://david-dm.org/webpack-contrib/copy-webpack-plugin.svg
|
---|
| 1184 | [deps-url]: https://david-dm.org/webpack-contrib/copy-webpack-plugin
|
---|
| 1185 | [tests]: https://github.com/webpack-contrib/copy-webpack-plugin/workflows/copy-webpack-plugin/badge.svg
|
---|
| 1186 | [tests-url]: https://github.com/webpack-contrib/copy-webpack-plugin/actions
|
---|
| 1187 | [cover]: https://codecov.io/gh/webpack-contrib/copy-webpack-plugin/branch/master/graph/badge.svg
|
---|
| 1188 | [cover-url]: https://codecov.io/gh/webpack-contrib/copy-webpack-plugin
|
---|
| 1189 | [chat]: https://img.shields.io/badge/gitter-webpack%2Fwebpack-brightgreen.svg
|
---|
| 1190 | [chat-url]: https://gitter.im/webpack/webpack
|
---|
| 1191 | [size]: https://packagephobia.now.sh/badge?p=copy-webpack-plugin
|
---|
| 1192 | [size-url]: https://packagephobia.now.sh/result?p=copy-webpack-plugin
|
---|
| 1193 | [glob-options]: https://github.com/sindresorhus/globby#options
|
---|