Создание древовидной библиотеки angular с одним модулем импорта

Question

Контекст

Я создаю библиотеку с 2 способами инициализации:

1. Automati c - я загружаю некоторые материалы для вас асинхронно, а затем инициализирую.
2. Вручную - вы уже загрузили материал раньше, затем я немедленно инициализирую библиотеку (syn c).

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

import { LibraryAsyncModule } from 'my-library'; // ? Or LibrarySyncModule

@NgModule({
    imports: [LibraryAsyncModule] // ? Or LibrarySyncModule
})
export class AppModule { }

Чего я хочу достичь sh ✔

Чтобы уменьшить кривую обучения работе с моей библиотекой, я пытаюсь создать единственный импортируемый модуль, который включает в себя соответствующий модуль и позволяет дерево встряхивая другой. Следующая диаграмма показывает желаемую структуру.

Чего я хочу избежать ?

Я мог бы создать фабричных провайдеров, которые будут обнаруживать config передается в forRoot() и загружается соответствующий модуль в runtime . Однако импорт модулей во время выполнения превращает инициализацию в asyn c, а также предотвращает связывание angular используемого модуля с приложением.

Мне нужно решение время сборки . Мои прототипы показывают, что простое включение обоих модулей syn c и asyn c в основной модуль приводит к объединению обоих. Как будет выглядеть этот единственный модуль? Есть идеи / предложения? ?

Answer 1

Ваш подход должен работать, но вам нужно его включить.

Так как Tree-shake работает только с es6 модулями, вам нужно опубликовать sh вашу библиотеку с этим и указать свойство module в вашем package.json.

// package.json
{
  ...
  "main": "dist/index.js",
  "module": "dist/es/index.js", // <- this file should contain es modules not commonjs
  ...
}

Эта установка скажет упаковщикам (в вашем случае, веб-пакет) использовать экспорт модулей es и разрешить им включить функцию встряхивания деревьев.

Я рекомендую для разработчиков пакетов использовать инструмент tsdx cli, который делает это автоматически и поддерживает многие другие функции, такие как поддержка TypeScript и т. Д. c.

npx tsdx create mylib