随着前端项目日益复杂，我们经常需要在构建后将某些文件或文件夹拷贝到指定目录下，例如将打包后的文件上传到 CDN 上，或者将构建出的代码及相关资源拷贝到其他项目的目录下。这时候，一个方便的自动化工具就显得尤为重要了。而 webpack-copy-on-build-plugin 就是一个非常方便的工具，它可以在 webpack 构建后自动执行拷贝操作。
安装
通过 npm 安装：
npm install --save-dev webpack-copy-on-build-plugin
使用
在 webpack 的配置文件中引入插件：
const CopyOnBuildPlugin = require('webpack-copy-on-build-plugin');然后，在 plugins 中添加该插件的实例：
-- -------------------- ---- -------
-------- -
--- -------------------
----- -------------
--- --------------
-------- -
------- ---------
-
--
-参数说明
from: 必选参数，要拷贝的文件或文件夹的源路径。to: 必选参数，拷贝到的目标路径。也可以使用函数来指定路径，函数需要返回目标路径的字符串。options: 可选参数，详见 CopyWebpackPlugin 中的 options。
示例
一个典型的示例配置如下，在打包结束后，可将指定的目录下的所有文件拷贝到指定的目录中。
-- -------------------- ---- -------
----- ---- - ----------------
----- ----------------- - ----------------------------------------
-------------- - -
------ -----------------
------- -
--------- ------------
----- ----------------------- -------
--
-------- -
--- -------------------
----- -------------
--- --------------
-------- -
------- ---------
-
--
-
--结语
webpack-copy-on-build-plugin 这个 npm 包为我们提供了一种方便的方式，在打包结束后自动将指定文件或文件夹拷贝到指定的目录中。它的简单易用，是前端开发过程中不可或缺的工具之一。欢迎尝试并使用！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005674081e8991b448e3c44