首页 > 解决方案 > 在模板中使用 Monorepo 库中的离子元素会导致应用程序级别“没有 ChangeDetectorRef 提供程序”错误

问题描述

我正在尝试为我的 Ionic 5 项目迁移到 monorepo 结构。为了在这个 monorepo 中的多个项目中重复使用我的 Ionic / Angular 组件和服务,我试图将它们分离到共享库中。一切都很顺利,直到我真正尝试在共享库组件的模板中使用离子元素(例如离子列表、离子按钮、离子项等)。在我这样做的那一刻,我开始收到这种性质的运行时错误(请注意,没有构建时间错误):

ERROR Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[IonItem -> ChangeDetectorRef]: 
  StaticInjectorError(Platform: core)[IonItem -> ChangeDetectorRef]: 
    NullInjectorError: No provider for ChangeDetectorRef!

我创建了一个最小的可重现示例并将其放在 GitHub 上:https ://github.com/vicatcu/devdacticMulti/tree/routing-problem

克隆它,然后在根目录中运行以下命令:

npm install && cd ./libraries/academy-lib/ && npm install && cd ../../projects/appOne && npm install && cd ../../ && npm run appOne

...它会启动一个网络浏览器,在开发工具控制台中一切都会好起来的。如果您导航到 /ref 而不是 /lazy 您将得到我所指的异常。如果模板中libraries/academy-lib/src/lib/academy-lib.component.ts不包含任何离子元素,则该页面也将加载而不会出现错误。

为了达到这一点,我一直在关注https://devdactic.com/ionic-multi-app-shared-library。我错过了什么?

标签: angularionic-frameworkmonorepoionic5

解决方案


所以经过多次试验和磨难,结果证明这是某种节点模块链接问题。解决方案是从根目录和所有子目录中删除 node_modules 文件夹,然后将子项目中的依赖项和 dev-dependencies 集成到 monorepo 和 npm install 根目录下的 package.json 文件中。然后通过 npm node_modules 解析的魔力,一切顺利。


推荐阅读