copy-webpack-plugin 12.x 版本中 globOptions.ignore 配置变更解析

问题背景

在升级到 copy-webpack-plugin 12.x 版本后，部分开发者遇到了一个构建错误："ERROR in directoryPaths.map is not a function"。这个错误通常出现在使用该插件复制静态资源文件时，特别是在配置 globOptions.ignore 选项时。

错误原因分析

这个问题的根源在于 globby 库（copy-webpack-plugin 的依赖项）对 ignore 配置项的处理方式发生了变化。在 fast-glob 3.3.1 版本后，ignore 选项不再支持直接传入字符串形式，而必须使用数组形式。

虽然之前版本中字符串形式的配置能够"幸运地"工作，但这实际上是依赖了特定实现的巧合行为。12.x 版本更新后，这种隐式兼容被移除，导致直接使用字符串配置时会出现类型错误。

解决方案

开发者需要将 globOptions.ignore 的配置从字符串形式改为数组形式。例如：

// 旧配置（会导致错误）
{
  globOptions: { ignore: '**/index.ejs' }
}

// 新配置（正确写法）
{
  globOptions: { ignore: ['**/index.ejs'] }
}

技术细节

1. globby 与 fast-glob 的关系：copy-webpack-plugin 内部使用 globby 来处理文件匹配，而 globby 又依赖于 fast-glob 库。fast-glob 从 3.3.1 版本开始就要求 ignore 必须是数组类型。

2. 类型检查强化：12.x 版本对参数类型检查更加严格，不再自动转换字符串为数组，这符合 JavaScript 生态中类型安全的趋势。

3. 向后兼容性：虽然这是一个破坏性变更，但由于它修复的是一个原本就不应该工作的用例，且解决方案简单明了，因此被包含在主要版本更新中。

最佳实践建议

1. 对于需要忽略多个模式的情况，直接在数组中添加多个项目：

   {
     globOptions: { 
       ignore: ['**/index.ejs', '**/temp/*', '**/.DS_Store'] 
     }
   }
   

2. 在升级主要版本时，建议仔细阅读变更日志，特别是关于配置选项格式的变更。

3. 对于复杂的忽略规则，考虑使用函数形式的 filter 选项来实现更精细的控制。

总结

copy-webpack-plugin 12.x 版本对 globOptions.ignore 配置的严格化处理，虽然带来了短暂的适配成本，但提高了代码的健壮性和可预测性。开发者只需简单地将字符串形式的忽略规则改为数组形式，即可解决构建错误问题。这个变更也提醒我们，在配置 webpack 插件时，应该始终遵循官方文档推荐的格式，而不是依赖实现细节的巧合行为。