angular - NG6 : library-provided service is undefined

Question

我正在寻求帮助/指导/指导来调试/理解派生类的问题，该派生类扩展了 Angular 6 项目中库提供的服务。

我正在尝试将现有的 Angular 5.x 项目移动到 Angular 6 项目中 angular.json 的新工作区格式。

我现有的项目由一个 Angular 应用程序和一个单独的共享 NgModule 组成，后者提供服务和其他功能。共享模块将在多个应用程序中使用，结构如下:

project-root/
    library/
    main-app/
    other-app/

在我现有的 NG5 代码中，共享库作为 TS 源文件被npm link'ed 到主应用程序中(尽管 CLI 团队明确不推荐，这对我团队的工作流程很有效).

在 NG6 应用程序中，library 是 angular.json 中的一个库项目，如此构建，并通过 tsconfig 中的路径定义拉入项目。 json.工作区是标准的 NG6 布局:

workspace-root/
    dist/...
    node_modules/...
    projects/
        library/
            src/lib/...
        main-app/
            src/app/...
        other-app/
    ...

在大多数情况下，库中提供的服务按原样使用，但可以在主应用程序(或其他应用程序)中扩展以提供特定于应用程序的功能。这在 Angular 5 中工作正常，但在 Angular 6 中，当我尝试加载页面时(使用 ng serve 运行)我在控制台中收到以下错误:

对象原型(prototype)只能是一个 Object 或 null

警告发生在这里:

export class FooService extends FooBaseService { // ...
--------------------------------^

当引导进程实例化 FooService 时，FooBaseService 将作为“未定义”进入。

根据研究，此错误通常与循环依赖问题有关，但我不认为这是正在发生的事情。我在构建库时没有收到任何 circ-dep 警告，也没有在构建主应用程序时收到任何问题。此外，运行 madge -c (link)在 dist/library 或 dist/main-app 中都没有找到任何 circ-deps。

我对如何继续调试这个问题有点困惑。任何对 Angular 6 如何处理模块提供的服务有更深入了解的人都可以为我指明正确的方向吗？

Answer 1

我猜你的 FooBarService 位于图书馆内。
使用 ng6 提供的新工作区结构，需要在使用之前构建库。您应该“ng build --prod”(prod 因为 AOT)库，然后将其作为库直接导入，而不是从其源代码导入。例如:从“foobar-service-library”导入 FooBarService；

您可以在这里阅读更多相关信息:https://blog.angularindepth.com/creating-a-library-in-angular-6-87799552e7e5