Angular StaticInjectorError错误

时间:2018-01-05 22:56:49

标签: angular typescript

我正在编写一个需要包装angular-oauth2-oidc的库。

Everything(库和消费者应用程序)编译得很好,但是在浏览器的运行时我得到以下错误:

ERROR Error: StaticInjectorError[InjectionToken DocumentToken]: 
  StaticInjectorError[InjectionToken DocumentToken]: 
    NullInjectorError: No provider for InjectionToken DocumentToken!
    at _NullInjector.get (core.js:993)
    at resolveToken (core.js:1281)
    at tryResolveToken (core.js:1223)
    at StaticInjector.get (core.js:1094)
    at resolveToken (core.js:1281)
    at tryResolveToken (core.js:1223)
    at StaticInjector.get (core.js:1094)
    at resolveNgModuleDep (core.js:10878)
    at _createClass (core.js:10919)
    at _createProviderInstance$1 (core.js:10889)

缩写代码:

图书馆模块:为我的图书馆定义NgModule,导入OAuthModule和所需的HttpClientModule。定义我的SomeService服务。

@NgModule({
    imports: [ HttpClientModule, OAuthModule.forRoot() ],
    providers: [ SomeService ]
})
export class SomeModule {}

图书馆服务:最低示例,除了实例化OAuth服务外什么都不做。

@Injectable()
export class SomeService {
    constructor(private oauth: OAuthService) {}
}

消费者应用模块:只需将我的库导入为SomeModule

@NgModule({
    ...
    imports: [ SomeModule ],
    bootstrap: [ AppComponent ]
})
export class AppModule { }

消费者组件:尝试调用我的库中的SomeService服务,会产生错误。

@Component({ ... })
export class AppComponent {
    constructor(
        private someService: SomeService
    ) {}
}
  • 库和应用程序都可以无误编译
  • 当我在浏览器中访问该应用时,我收到上述错误
  • 如果我从库导入中删除HttpClientModule,则表示我缺少HttpClient而不是上面的错误
  • 图书馆使用angular-library-seed
  • 构建
  • 应用程序使用@angular/cli
  • 构建

我尝试过很多东西,比如......

  • 让应用程序也导入OAuthModule
  • 删除库中.forRoot()上的OAuthModule.forRoot()表示图书馆无法访问OAuthModule内的服务
  • 更改库也使用.forRoot(),几乎包含providers数组中的每个服务组合(在它自身之间,OAuthService和HttpClientService)。
  • 将webpack配置更改为不将@ angular / *列为外部
  • 更改webpack配置以将OAuth库列为外部
  • 使用汇总代替webpack,使用来自两个独立种子项目的配置
  • 更多的东西归结为只是抓住稻草

谷歌搜索,似乎这个错误可能发生在他们的NgModule上的供应商数组中缺少明显的东西时;这似乎不适用于我。我不在任何地方使用“ DocumentToken ”。

我也看到一个常见的修复方法是导入HttpClientModule,我已经做过这件事无济于事。

我发现其他人的一个实例正在使用“DocumentToken”收到此错误。他们在this commit中修复了他们的库,这似乎只是为他们的汇总配置添加了更多的外部。虽然我的库使用webpack,但它使用webpack-angular-externals来确保所有@ angular / *包都列为外部。

非常感谢任何帮助或想法。

(Angular 5,TypeScript 2.6.2)

0 个答案:

没有答案