Webpack CopyPlugin : 添加文件到插件目录答案

【问题标题】：Webpack CopyPlugin : add file to plugin directoryWebpack CopyPlugin : 添加文件到插件目录
【发布时间】：2021-07-12 07:46:28
【问题描述】：

我想在我的 webpack 编译期间将当前模块文件夹添加到我的 dist/ 目录。现在，在 /dist 中，我有类似的东西

const toCopy = [
  './../../../../node_modules/flatpickr/dist/flatpickr.min.js',
  './../../../../node_modules/flatpickr/dist/flatpickr.min.css',
]

这是我的 webpack CopyPlugin 的一部分

...
  plugins: [
    new CopyPlugin({
      patterns: toCopy.map((entry) => {
        console.log(entry);
        return { from: entry }
      })
    })
  ]

它给了我这个

/dist
  flatpickr.min.css
  flatpickr.min.css

如果来自不同模块的文件具有相同的名称，我希望这样可以避免冲突。

例如，flatpickr 作为 ie.css, fr.js... 但其他一些模块也可能包含这些文件

/dist
 /flatpickr
     flatpickr.min.css
     flatpickr.min.css

【问题讨论】：

标签： npm webpack compilation

【解决方案1】：

最后我创建了一个循环遍历所有要复制的资产以保留 CopyPlugin 结构

const toCopy = new Map();
toCopy.set('popper', './../../contrib/bootstrap_sass/js/popper.min.js',);
toCopy.set('flatpickr', ['./../../../../node_modules/flatpickr/dist/flatpickr.min.js',
  './../../../../node_modules/flatpickr/dist/flatpickr.min.css']);

let toCopyFormatted = [];
for (let [dest, entries] of toCopy.entries()) {
  if (typeof entries === 'string') {
    let data = {to: dest}
    data['from'] = entries;
    toCopyFormatted.push(data);
  } else {
    entries.forEach(function (v, k) {
      let data = {to: dest}
      data['from'] = v;
      toCopyFormatted.push(data);
    })
  }
}

【讨论】：