从自定义Angular模块注入服务会生成错误：NullInjectorError：没有HttpClient的提供程序

Question

我正在尝试开发一个自定义NPM模块，该模块将提供客户端服务以包含在各种Angular 5应用程序中。在我的模块中，我有一个登录服务：

import { Inject, Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/toPromise';

@Injectable()
export class VicadsLoginService {

  constructor(private httpClient : HttpClient) {
  }

  public login(username: string, password: string) : Promise<string> {
    let vicadsServer = window.location.hostname;
    if (vicadsServer === "localhost") vicadsServer = "vicads-server.vicads5.local";
    console.log("VICADS server is " + vicadsServer)
    try {
      return this.httpClient.get('https://' + vicadsServer + ':8443/VicadsLoginPlainText/Login?username=' + username + '&password=' + password,
        {
          responseType: 'text',
        })
        .toPromise()
        .then(response => response)
        .catch(this.handleError);
    } catch (error) {
      console.log("Login failed: " + error)
      return Promise.reject("Login failed: " + error);
    }
  };

  public logout() : void {
  }

  private handleError (error: any) {
      let errMsg = (error.message) ? error.message : error.status ? `${error.status} - ${error.statusText}` : 'Server error';
      console.error(errMsg); // log to console instead
      return Promise.reject(errMsg);
  }
}

我有一个模块文件：

import { NgModule } from '@angular/core';
import { VicadsLoginService } from './services/vicads-login.service';

@NgModule({
  declarations: [
  ],
  imports: [
  ],
  providers: [
    VicadsLoginService,
  ],
  exports: [
  ]
})
export class Vicads5Module {
}

在我的应用程序中，我导入了模块（称为Vicads5Module）：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
import { environment } from 'environments/environment';
import { AppComponent } from './app.component';
import { APP_RESOLVER_PROVIDERS } from './app.resolver';
import { AppState, InternalStateType } from './app.service';
import { Vicads5Module } from 'vicads5-module';

import '../styles/styles.scss';
import '../styles/headings.css';

// Application wide providers
const APP_PROVIDERS = [
  ...APP_RESOLVER_PROVIDERS,
  AppState
];

/**
 * `AppModule` is the main entry point into Angular2's bootstraping process
 */
@NgModule({
  bootstrap: [ AppComponent ],
  declarations: [
    AppComponent  ],
  /**
   * Import Angular's modules.
   */
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    FormsModule,
    HttpClientModule,
    Vicads5Module,
  ],
  /**
   * Expose our Services and Providers into Angular's dependency injection.
   */
  providers: [
    environment.ENV_PROVIDERS,
    APP_PROVIDERS
  ]
})
export class AppModule {
}

我的AppComponent尝试注入登录服务：

import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { environment } from 'environments/environment';
import { AppState } from './app.service';
import { VicadsLoginService } from 'vicads5-module';

/**
 * App Component
 * Top Level Component
 */
@Component({
  selector: 'app',
  encapsulation: ViewEncapsulation.None,
  styleUrls: [ './app.component.css' ],
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
  public name = 'VICADS Viewer';
  public psgLogo = 'assets/img/psgglobal-50x50.png';
  public psgUrl = 'https://www.psgglobal.net';
  public showDevModule: boolean = environment.showDevModule;

  private username: string;
  private password: string;
  private loginError: string;
  private loginMessage: string;
  private loggedIn: boolean = false;

  constructor(
    public appState: AppState,
    private vicadsLoginService: VicadsLoginService) {
  }

  public login() : void {
    delete this.loginError;
    delete this.loginMessage;
    this.vicadsLoginService.login(this.username, this.password)
      .then(result => { this.loginMessage = result; this.loggedIn = true; })
      .catch(error => this.loginError = error);
  }

  public logout() : void {
    this.vicadsLoginService.logout();
    delete this.loginError;
    delete this.loginMessage;
    this.loggedIn = false;
  }

  public ngOnInit() {
    console.log('Initial App State', this.appState.state);
  }

}

但是，当我尝试加载页面时，出现以下错误：

StaticInjectorError[HttpClient]: 
  StaticInjectorError[HttpClient]: 
    NullInjectorError: No provider for HttpClient!

知道我做错了吗？