Webpack copyFiles将文件从子目录复制到主目录

Question

我有一个图像目录，如下所示：

在icons子目录中，我有SVG来组织结构。

在webpack中，我指定以下内容：

.copyFiles({
     from: './assets/images',
     to: '[path][name].[hash:8].[ext]',
     context: './assets'
})

构建中发生的情况如下：

这里发生的是将其复制目录中的所有图标并将其直接复制到images目录，同时还复制了icons目录。它做了两次。有什么原因会发生这种情况吗？如何确保它不会在webpack中复制两次内容？

Answer 1

您使用什么来复制文件？

使用copy-webpack-plugin并在路径中指定 glob 。看看this as a real working example

对于您来说，您可以使用./assets/images/**/*之类的源作为源，它应能按预期工作。

Answer 2

对于已经在项目上运行很长时间的图像，请尝试以下配置：

  {
    test: /\.(png|svg|jpe?g|gif|webp)$/,
    use: [ 
      {
          loader: 'file-loader',
          options: {
          name: '../img/[name].[ext]'
        }
      }
    ]
  },

它将图像复制到./img/文件夹