Angular 12 - 未捕获的类型错误 : Cannot read properties of undefined (reading 'ngModule' ) at isModuleWithProviders

标签 angular angular-module angular-library angular12

core.js:27296 Uncaught TypeError: Cannot read properties of undefined (reading 'ngModule')
    at isModuleWithProviders (core.js:27296)
    at expandModuleWithProviders (core.js:27290)
    at Array.map (<anonymous>)
    at Function.get (core.js:26927)
    at getNgModuleDef (core.js:1117)
    at assertNgModuleType (core.js:1296)
    at compileNgModuleFactory__POST_R3__ (core.js:29073)
    at PlatformRef.bootstrapModule (core.js:29324)
    at Module.14431 (main.ts:11)
    at __webpack_require__ (bootstrap:19)

我有一个由主项目 (app) 使用的自定义库。在我将项目更新到 Angular 12 之前,一切都很好。

我遵循了更新说明 here , 对于主项目和自定义库

当我服务时没有编译错误,当我使用 --prod 标志构建时也没有构建错误。但是,当我尝试从浏览器本地评估应用程序时,出现上述错误。

我试过调试它。这让我想到了这些解决方案,herehere .通过这些,我能够将错误跟踪到从自定义库导入的模块。但这就是我被困的地方。

请问有人可以协助解决错误并运行应用程序吗?

应用模块

import { UtilsModule } from '@utils/utils.module';
import { PipesModule } from '@pipes/pipes.module';

...

@NgModule({
    imports: [
        BrowserModule,
    ...
        PipesModule,
        UtilsModule
    ]
})

tsconfig.json

{
"paths": {
      ...
      "@pipes/*": [
        "./node_modules/custom-library/src/pipes/*"
      ],
      "@utils/*": [
        "./node_modules/custom-library/src/utils/*"
      ],
     ...
   }
 ...
 }

包.json

{
 ...
 "dependencies": {
     ...
     "custom-library": "url-to-repository-branch"
     ...
   }
 ...
}

库是用这种方法安装的here

最佳答案

经过一天的故障排除,这是我发现的......

问题

我们的项目中有几个未发布的 Angular 库。

在本地开发的时候,一切正常。然而,在部署到生产环境时,tsconfig.json 中定义的路径不知何故丢失了。

解决方案

  • 从库npm build [project-library]
  • 创建构建
  • 从该新文件夹创建一个包 npm package [path-to-build-library]
  • npm 根据 tgz 文件安装该库:
    • npm i "file:/./tmp/library-to-import.0.0.1.tgz"
  • 从包中导入组件时,必须从构建和安装的包中导入组件,而不是源代码

这解决了我的问题。

关于Angular 12 - 未捕获的类型错误 : Cannot read properties of undefined (reading 'ngModule' ) at isModuleWithProviders,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69118542/

相关文章:

Angular 2 'component' 不是已知元素

angular - 带有 ngx-translate 的自定义 Angular 库

angular - 如何从被调用组件内部访问 MatDialogConfig?

angular - 要在 Angular Material 中单击按钮时启用或禁用选择组件

angular - 空注入(inject)器错误: No provider for ElementRef

库中的 Angular 默认管道不起作用

angular - 任何人都可以向我解释一下给定的代码片段吗?它能做什么?

angular - 带有嵌套下拉选项(如 angular1)的 Material 设计 angular2/4 菜单的示例是什么?

forRoot 方法中的 Angular 调用函数