＜Webpack插件＞如何将Webpack打包成功的文件夹拷贝到指定地方？

最新推荐文章于 2024-04-11 16:27:38 发布

别放弃你热爱学习的心

最新推荐文章于 2024-04-11 16:27:38 发布

阅读量1.3k

点赞数 1

文章标签： javascript

本文链接：https://blog.csdn.net/qq_42617625/article/details/107965648

版权

本文介绍了如何使用Webpack的CopyWebpackPlugin插件将打包后的文件夹复制到特定位置。通过新建CopyWebpackPlugin.js配置插件，并在webpack.config.js中引入，可以实现文件的自动拷贝。

摘要由CSDN通过智能技术生成

新建一个 CopyWebpackPlugin.js 文件，代码如下：

const fs = require('fs')
const path = require('path')

/**
 * webpack 脚本
 * @description webpack 打包完成并且生成资源到 output 目录之后，会将生成的资源复制到 springboot 项目中
 */
module.exports = class CopyWebpackPlugin {
   
  /**
   * 
   * @param { String } options.dirFiles 目录，复制该目录下所有文件(非文件夹)
   * @param { String } options.dir 目录，复制该目录下所有文件夹下的所有文件
   * @param { String } options.dirTo 复制到该目录
   * @param { String } options.dirFilesTo 复制到该目录
   */
  constructor(options) {
   
    this.options = options
  }

  // webpack 规定每个插件的实例，必须有一个 .apply() 方法，webpack 打包前会调用所有插件的方法，插件可以在该方法中进行钩子的注册。
  apply(compiler) {
   
    compiler.hooks.afterEmit.tapAsync('CopyWebpackPlugin', (compilation, cb) => {
   
      try {
   
        if (!fs.copyFile) {
   
          console.error('Your nodejs version is too low, please upgrade!')
        } else {
   
          if (!fs.existsSync(this.options.dirFilesTo)) {
   
            fs.mkdirSync(this.options.dirFilesTo, {
    recursive: true })
          } else {
   
            delDir(this.options.dirFilesTo)
          }
          if (!fs.existsSync(this.options.dirTo)) {
   
            fs.mkdirSync(