使用单个导入模块创建可摇树的角度库

Question

上下文

我正在用两种初始化方法创建一个库：

1. 自动-我异步为您下载一些内容，然后进行初始化。
2. 手册-您之前已经下载了内容，然后立即对我进行了初始化（同步）​​。

我过去已经成功实现了可树状存储的库。我们通常要做的是将代码分成两个模块，然后让应用程序开发人员选择要导入的模块，从而摇晃另一部分。与此类似：

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

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

我想完成的任务

为了减少使用我的库的学习难度，我试图设计一个单独导入的模块，其中包括相关模块，并允许其他模块摇晃。下图显示了所需的结构。

我要避免的事情

我可以创建工厂提供程序来检测传递给forRoot()的配置，并在运行时加载相应的模块。但是，在运行时导入模块会将初始化变为异步，并且还可以防止angular将使用的模块与应用捆绑在一起。

我需要一个构建时间解决方案。我的原型表明，仅将同步模块和异步模块都包含在核心模块中会导致两者捆绑在一起。 单个模块的外观如何？有什么想法/建议吗？ ?

Answer 1

您的方法应该可行，但是您需要启用它。

由于摇树仅适用于es6个模块，因此您需要使用它来发布lib并在module中指定package.json属性。

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

此设置将告诉捆绑程序（在您的情况下为webpack）使用es模块导出并允许其启用树状摇动功能。

我建议软件包开发人员使用tsdx cli工具，该工具会自动执行此操作，并支持许多其他功能，例如TypeScript支持等。

npx tsdx create mylib