NullInjectorError.NxSpinnerService上的NullInjectorError。StaticInjectorError on NgxSpinnerService; NullInjectorError: 当尝试在firebase中托管时，没有t！的提供者。

Question

我试图在firebase中托管我的应用程序，在本地主机上一切都很好，但当我在firebase域成功托管应用程序时，它显示。

NullInjectorError: StaticInjectorError(wo)[class{constructor(t,e) at SpinnerService at content is not loaded.

我试图插入提供 ngxModule 和 ngxSpinnerService 但我还是有同样的问题。

我的代码 app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule,FormsModule } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {NgxPaginationModule} from 'ngx-pagination';
import { CommonModule } from '@angular/common';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { HttpClientModule } from '@angular/common/http';
import { AnimeComponent } from './anime/anime.component';
import { NgxSpinnerModule, NgxSpinnerService } from "ngx-spinner";
import { CharacterComponent } from './character/character.component';
import { NotfoundComponent } from './notfound/notfound.component';
import { AppFirebaseModule } from './app-firebase/app-firebase/app-firebase.module';
import { AnimeService } from './services/anime.service';
@NgModule({
declarations: [
AppComponent,
HomeComponent,
AnimeComponent,
CharacterComponent,
NotfoundComponent
],
imports: [
CommonModule,
NgxPaginationModule,
BrowserAnimationsModule,
FormsModule,
ReactiveFormsModule,
BrowserModule,
HttpClientModule,
NgxSpinnerModule,
AppRoutingModule,
//i tried adding in imports array.
AppFirebaseModule,
],
            
 //i added NgxSpinnerService in providers array like here:
providers: [NgxSpinnerService,AnimeService],
bootstrap: [AppComponent]
})
export class AppModule { }        
//And  at other bunch of  component i have this:
I have this at animecomponent:
import { Component, OnInit } from '@angular/core';
import { ActivatedRouteSnapshot, ActivatedRoute } from '@angular/router';
import { AnimeService } from './../services/anime.service';
import { Animedetail } from './../model/animedetail';
import { Character } from './../model/character';
import { NgxSpinnerService } from "ngx-spinner";
import { CommonModule } from '@angular/common';
@Component({
selector: 'app-anime',
templateUrl: './anime.component.html',
styleUrls: ['./anime.component.css']
})
export class AnimeComponent implements OnInit {
animeDetail:Animedetail;
page;
id:number;
genres:[];
studios:[];
adaptation:[];
sequel:[];
sideStory:[];
opening_themes:[]
ending_themes:[];
character:Character[];
showPagination:boolean = true;
 constructor(
 private activatedRoute:ActivatedRoute,
 private animeService:AnimeService,
 private spinner:NgxSpinnerService,
) { }
                
ngOnInit() {
this.spinner.show();
this.id = this.activatedRoute.snapshot.params.id;
this.animeService.getAnimeDetail(this.id).subscribe((data:Animedetail) =>{
this.animeDetail = data;
this.genres = data.genres;
this.studios = data.studios;
this.adaptation = data.related.Adaptation;
this.sequel = data.related['Sequel'];
this.sideStory = data.related['Side story'];
this.opening_themes = data.opening_themes;
this.ending_themes = data.ending_themes;
})
                    
this.animeService.getCharacters(this.id).subscribe((data:Character)=>{
// console.log(data)
this.character = data.characters;
this.spinner.hide();
})
                      
}
                    
 }
            
            

在本地主机上运行正常，没有任何错误。但是当我在firebase上成功托管后，却出现了这样的错误，app也不能用了，我试着在appmodule.ts中的provisions数组中导入NgxSpinnerService，但是还是不行。

我试着在appmodule.ts的provers数组中导入NgxSpinnerService，但在主机上还是显示错误。点击这里查看错误信息

Answer 1

我也面临同样的问题。解决方法是使用相同版本的ngx-spinner和angular，比如我使用angular 8.0.0和ngx-spinner 9.0.2。因此，我不得不将ngx-spinner的版本降到8.0.0来匹配angular的版本。