[英]Nx Module Federation with Angular - No provider for HttpClient
I have setuped a micro front-end Nx (13.10.3)
workspace with Angular (13.3.0)
and @nrwl/angular (13.10.3)
module federation.我已经使用
Angular (13.3.0)
和@nrwl/angular (13.10.3)
模块联合设置了一个微前端Nx (13.10.3)
工作区。 When I try to load a route which is loading a remote module I am getting the error below.当我尝试加载正在加载远程模块的路由时,出现以下错误。 I have added
HttpClientModule
in the app.module.ts
.我在
app.module.ts
添加了HttpClientModule
。
core.mjs:6500 ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(RemoteEntryModule)[HttpClient -> HttpClient -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
NullInjectorError: R3InjectorError(RemoteEntryModule)[HttpClient -> HttpClient -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
at NullInjector.get (core.mjs:11160:27)
at R3Injector.get (core.mjs:11327:33)
at R3Injector.get (core.mjs:11327:33)
at R3Injector.get (core.mjs:11327:33)
at NgModuleRef.get (core.mjs:21886:33)
at R3Injector.get (core.mjs:11327:33)
at NgModuleRef.get (core.mjs:21886:33)
at Object.get (core.mjs:21563:35)
at lookupTokenUsingModuleInjector (core.mjs:3365:39)
at getOrCreateInjectable (core.mjs:3477:12)
at resolvePromise (zone.js:1211:1)
at resolvePromise (zone.js:1165:1)
at zone.js:1278:1
at _ZoneDelegate.invokeTask (zone.js:406:1)
at Object.onInvokeTask (core.mjs:25605:33)
at _ZoneDelegate.invokeTask (zone.js:405:1)
at Zone.runTask (zone.js:178:1)
at drainMicroTaskQueue (zone.js:585:1)
My team has recently gone through this process and this is what has worked for us across multiple remotes:我的团队最近经历了这个过程,这对我们来说是跨多个遥控器的:
Quick caveat for posterity : avoid exposing the remote's AppModule
, use RemoteEntry
or another feature module instead eg DashboardModule
, NavigationModule
, etc. (You are already doing this in the above example)对后代的快速警告:避免暴露遥控器的
AppModule
,使用RemoteEntry
或其他功能模块,例如DashboardModule
、 NavigationModule
等(您已经在上面的示例中这样做了)
HttpClientModule
in your shell's AppModule
AppModule
中导入HttpClientModule
HttpClientModule
in your remote's RemoteEntryModule
or feature module.RemoteEntryModule
或功能模块中导入HttpClientModule
。 The shell should import BrowserModule
/ BrowserAnimationsModule
in its AppModule
. shell 应该在其
AppModule
中导入BrowserModule
/ BrowserAnimationsModule
。
Individual remotes' RemoteEntryModule
/feature modules should only import CommonModule
.单个遥控器的
RemoteEntryModule
/feature 模块应该只导入CommonModule
。
You can import BrowserModule
/ BrowserAnimationsModule
(in addition to your RemoteEntryModule
/feature module) in the individual MFEs' AppModule
so they will build and serve independently - AppModule
code should not be exposed to the shell.您可以在各个 MFE 的 AppModule 中导入
BrowserModule
/ BrowserAnimationsModule
(除了您的RemoteEntryModule
/feature 模块),以便它们独立构建和服务 - AppModule
代码不应暴露给AppModule
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.