Сборка динамического загрузчика компонентов с помощью Angular CLI

Question

В основном я хочу создать динамическую систему плагинов. Мне нужно иметь возможность развертывать новые плагины без необходимости повторного развертывания основной системы плагинов.

В основном, если бы я использовал SystemJS, я мог бы просто сделать что-то вроде

System.import(url).then(plugin => {
  this.createComponent(plugin.default);
});

url будучи динамической вещью - мог прочитать это из БД или конфига и т. д.

Выше может работать - за исключением того, что я использую Angular CLI, который использует Webpack. Использование CLI - выбор, сделанный просто для всего проекта - поэтому я застрял с Webpack и CLI.

Поскольку Angular CLI делает много абстракций, я не могу изменить конфигурацию веб-пакета (ну, я могу, но тогда мне придется поддерживать его вручную, что опять-таки нарушило бы простоту).

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

Какие у меня будут варианты?

РЕДАКТИРОВАТЬ: Webpack имеет свой собственный System.import, но он имеет некоторые проверки, чтобы увидеть, является ли URL-адрес статическим или динамическим. Я мог бы жить с передачей статической папки и необходимостью помещать плагины в эту папку - это, кажется, не работает нигде, кроме как внутри самого приложения.

Answer 1

К сожалению, насколько я знаю, в конце дня вам нужно добавить свой динамический компонент в entryComponents текущего модуля, в противном случае Angular не позволит вам загрузить его динамически, и он будет жаловаться.

Так или иначе, вы должны загрузить компонент статически и поместить его в entryComponentsтак что не стоит особо использовать SystemJS или что-то еще, вы можете просто создать словарь и использовать его, когда захотите:

import {MyComponentClass} откуда-то;

const dictionary = {
    component1  = MyComponentClass
}

 this.createComponent(dictionary[urlOrName]);

---

Другим возможным решением было бы создать модуль для каждого компонента, который вы собираетесь загружать динамически, а затем добавить этот компонент в entryComponents таким образом, вы могли бы динамически импортировать / загружать этот модуль, но я не уверен, можно ли динамически добавлять этот динамический модуль в корневой модуль (как маршрутизатор делает это при lazyLoading!~~).

Раньше Angular был намного проще в отношении динамических компонентов, прежде чем они вводились AOTони честно убили простоту введением AOT