angular 进入一个模块直接白屏，前端报错，console信息ERROR Error: Uncaught (in promise): NullInjectorError:R3InjectorError(s)[Q -> Q -> Q -> Q]:具体如下：

  1. ERROR Error: Uncaught (in promise): NullInjectorError:R3InjectorError(s)[Q -> Q -> Q -> Q]: 
  2.   NullInjectorError: No provider for Q!
  3.   NullInjectorError: R3InjectorError(s)[Q -> Q -> Q -> Q]: 
  4.   NullInjectorError: No provider for Q!
  5.     at i.value (main.a461322da124cee6.js:1:1475005)
  6.     at i.value (main.a461322da124cee6.js:1:1476945)
  7.     at i.value (main.a461322da124cee6.js:1:1476945)
  8.     at i.value (main.a461322da124cee6.js:1:1476945)
  9.     at l.value (main.a461322da124cee6.js:1:1508441)
  10.     at i.value (main.a461322da124cee6.js:1:1476945)
  11.     at l.value (main.a461322da124cee6.js:1:1508441)
  12.     at Object.get (main.a461322da124cee6.js:1:1504831)
  13.     at No (main.a461322da124cee6.js:1:1439692)
  14.     at Bu (main.a461322da124cee6.js:1:1440457)
  15.     at H (polyfills.84765f97c71fb3a1.js:1:17381)
  16.     at H (polyfills.84765f97c71fb3a1.js:1:16916)
  17.     at polyfills.84765f97c71fb3a1.js:1:18226
  18.     at h.invokeTask (polyfills.84765f97c71fb3a1.js:1:8046)
  19.     at Object.onInvokeTask (main.a461322da124cee6.js:1:1526603)
  20.     at h.invokeTask (polyfills.84765f97c71fb3a1.js:1:7967)
  21.     at h.runTask (polyfills.84765f97c71fb3a1.js:1:3117)
  22.     at d (polyfills.84765f97c71fb3a1.js:1:10368)

原因分析

问题的主要原因是注入的一个服务、模块或者组件没有找到，导致空指针了，但是由于这个提示只是提示Q，并不知道具体是是什么模块导致的，这样的话，我们需要先需要在angular.json里面加入一个参数”optimization”: false 来获取详细的是什么模块注入存在问题。

  1.    "architect": {
  2.         "build": {
  3.           "builder": "@angular-devkit/build-angular:browser",
  4.           "options": {
  5.             "optimization": false,
  6.             ...

开启参数后，日志如下,原来是NzModalService注入有问题

  1. ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(SettingModule)[NzModalService -> NzModalService -> NzModalService -> NzModalService]: 
  2.   NullInjectorError: No provider for NzModalService!
  3. NullInjectorError: R3InjectorError(SettingModule)[NzModalService -> NzModalService -> NzModalService -> NzModalService]: 
  4.   NullInjectorError: No provider for NzModalService!
  5.     at NullInjector.get (main.js:200832:21)
  6.     at R3Injector.get (main.js:201053:29)
  7.     at R3Injector.get (main.js:201053:29)
  8.     at R3Injector.get (main.js:201053:29)
  9.     at NgModuleRef.get (main.js:213427:31)
  10.     at R3Injector.get (main.js:201053:29)
  11.     at NgModuleRef.get (main.js:213427:31)
  12.     at Object.get (main.js:212990:29)
  13.     at lookupTokenUsingModuleInjector (main.js:191106:31)
  14.     at getOrCreateInjectable (main.js:191228:10)
  15.     at resolvePromise (polyfills.js:10700:21)
  16.     at resolvePromise (polyfills.js:10647:11)
  17.     at polyfills.js:10774:11
  18.     at ZoneDelegate.invokeTask (polyfills.js:9660:173)
  19.     at Object.onInvokeTask (main.js:217898:25)
  20.     at ZoneDelegate.invokeTask (polyfills.js:9660:56)
  21.     at Zone.runTask (polyfills.js:9410:39)
  22.     at drainMicroTaskQueue (polyfills.js:9876:25)

原因是我在setting模块里面引入的公共模块里面依赖了nzModal 但是公共模块里面没有引入NzModalModule,处理方法如下，导入NzModalModule。

  1. import { NzModalModule } from 'ng-zorro-antd/modal';
  2. @NgModule({
  3.   declarations: [...],
  4. imports: [
  5.      NzModalModule
  6.   ],