Как динамически добавлять модуль / зависимость с помощью плагина webpack?

#javascript #webpack #webpack-2 #webpack-plugin

#javascript #webpack #webpack-2 #webpack-плагин

Вопрос:

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

Как мне внедрить «динамический» модуль в сборку webpack? Я хочу создать этот модуль во время сборки.

Для простого примера, как мне ввести эту строку в качестве нового модуля при сборке?

 "module.exports = new Date();"
  

Тогда, допустим, я хочу, чтобы у этого модуля было имя «myDate»

Я бы очень хотел, чтобы любой другой модуль в моем приложении мог разрешить это с помощью:

 var myDate = require('myDate');
  

Теперь это очень простой пример. Моя цель будет намного сложнее и будет включать чтение файлов для создания этого «динамического» модуля. Я знаю о плагине define, и он, к сожалению, не соответствует моим потребностям.

Я был бы очень признателен за любую помощь. Спасибо.

Комментарии:

1. Одной из идей было бы сделать var myDate = require('./path/to/dynamically/generated/file'); затем, во время сборки, вы бы создали файл по этому пути, используя любые средства, которые вы хотите. Помогает ли это вообще?

2. @jmeas Да, я тоже об этом думал.. Я хотел избежать этого, потому что я добавляю файлы cruft в файловые системы людей, которые используют мой плагин. Также он имеет длинный путь «require» к физическому файлу. Где я хочу больше использовать тип псевдонима.

3. Вы также могли бы написать плагин для загрузки webpack, который генерирует js и передает его в процесс компиляции webpack.

4. @ChrisSeufert у вас есть пример? Или документы? Я действительно изучал это, но все было так запутанно.

Ответ №1:

Найден этот плагин: virtual-module-webpack-plugin

Пример использования, описанный в README.md

 const VirtualModulePlugin = require('./virtual-module-webpack-plugin');

  // ...

  plugins: [
    new VirtualModulePlugin({
      moduleName: 'src/mysettings.json',
      contents: JSON.stringify({ greeting: 'Hello!' })
    })
  ]
}
  

Вы можете просмотреть реализацию и попробовать свою собственную.