运用webpack复制静态文件

1. 运用yarn或npm添加相应的依赖包

 
在命令行中输入
 

    npm install copy-webpack-plugin --save-dev

或

    yarn add copy-webpack-plugin -D

 

2. 在webpack.config.js 中引入依赖，根据实际项目路径并进行配置

 

  
 图1：
  

  
当项目需要转移某个文件夹，并忽略掉某些特定文件时（例：test.html）：

 

 
图2：
 

3. 然后通过webpack进行打包

  
在命令行中输入(webpack4.x版本):
  
 

    webpack --mode production

 
图1配置打包可得结果如下：
 
 

 
图2配置打包可得结果如下：
 

 
可以发现，静态文件都已经按要求成功进行转移。
 
 
注：常见错误
 
 
  文件夹的相对路径比较容易写错，构建就会报如下错误
 
 

    Error in [copy-webpack-plugin] unable to local "**" at "**"

 
  使用Node.js中的全局变量__dirname+文件夹路径即可（例：“/src/assets”）