плагин webpack, который добавляет другие плагины - PullRequest
0 голосов
/ 17 мая 2018

Я пытаюсь создать плагин, который действует как плагин-плагин , загружая конфигурацию, файлы и т. Д. И добавляя дополнительные плагины в текущий процесс компиляции веб-пакетов.

В функции apply я создаю плагины, а затем применяю их к исходному компилятору, что-то вроде этого:

apply(compiler) {
  const plugins = [
    new HtmlWebpackPlugin(options1),
    new HtmlWebpackPlugin(options2),
    ...
  ];

  plugins.forEach((plugin) => {
    plugin.apply(compiler);
  });
});

Мой плагин не добавляет никаких хуков к компилятору webpack, но позволяет другим плагинам добавлять их. Это хорошо работает, когда контейнерный проект использует webpack 4 ... но я обнаружил ошибку при работе с различными версиями webpack.

Один из вставленных плагинов - это html-webpack-plugin, который зависит от моего плагина:

package.json

"dependencies": {
  "copy-webpack-plugin": "^4.5.1",
  "html-webpack-plugin": "^3.2.0",
  "webpack-bundle-analyzer": "^2.11.3"
}

Итак, как вы можете себе представить, я внедряю экземпляры этих 3 плагинов.

Проблема возникает, когда в проекте, использующем мой плагин, используется webpack 3, потому что в какой-то момент внутри html-webpack-plugin требуется NodeTemplatePlugin, что ниже html-webpack-plugin/node_modules/webpack. Так что, насколько я понимаю, html-webpack-plugin имеет свой webpack, который webpack 4. Поскольку исходное значение, переданное compiler, взято из webpack 3, а ожидаемое в NodeTemplatePlugin - webpack 4, я получаю сообщение об ошибке, когда последний пытается получить доступ к compiler.hooks.thisCompilation, поскольку он не существует в компиляторе из webpack 3.

Забавно, но в моем пакете json webpack определяется как peerDependency (так же, как в html-webpack-plugin), поэтому его не следует устанавливать под node_modules моего плагина.

"peerDependencies": {
  "webpack": "^2.0.0 || ^3.0.0 || ^4.0.0"
},

Есть идеи, почему это происходит, или альтернатива тому, как добавить плагины из другого плагина?

Если вам нужно больше контекста / кода, вы можете проверить его здесь:
https://github.com/danikaze/generate-examples-index-webpack-plugin/blob/dev/src/ExamplesGenerator.js#L61

...