Angular4网站无法正常工作

Question

我刚把我的网站从angular2改为angular4。当一个do ng serve it运行完美时，它只会警告我一个应该是ng-template的折旧模板，但我使用ng-bootstrap，当我将模板标签更改为ng-template时，它停止了工作。

但是很好，我做了构建，它也是完美的，没有错误。但它仍然不再显示我的网站，我得到了这个错误：

Uncaught InvalidProviderError {_nativeError: Error: Invalid provider - only instances of Provider and Type are allowed, got: undefined
    at Inv…}message: (...)name: (...)stack: (...)_nativeError: Error: Invalid provider - only instances of Provider and Type are allowed, got: undefined
    at InvalidProviderError.BaseError [as constructor] (http://beterfysiek.nl/vendor.bundle.js:7029:27) [<root>]
    at new InvalidProviderError (http://beterfysiek.nl/vendor.bundle.js:59093:16) [<root>]
    at http://beterfysiek.nl/vendor.bundle.js:42468:19 [<root>]
    at Array.forEach (native) [<root>]
    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15) [<root>]
    at http://beterfysiek.nl/vendor.bundle.js:42465:13 [<root>]
    at Array.forEach (native) [<root>]
    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15) [<root>]
    at resolveReflectiveProviders (http://beterfysiek.nl/vendor.bundle.js:42408:39) [<root>]
    at Function.ReflectiveInjector.resolve (http://beterfysiek.nl/vendor.bundle.js:82535:127) [<root>]
    at Function.ReflectiveInjector.resolveAndCreate (http://beterfysiek.nl/vendor.bundle.js:82566:79) [<root>]
    at JitCompilerFactory.createCompiler (http://beterfysiek.nl/vendor.bundle.js:76275:107) [<root>]
    at PlatformRef_._bootstrapModuleWithZone (http://beterfysiek.nl/vendor.bundle.js:40647:57) [<root>]
    at PlatformRef_.bootstrapModule (http://beterfysiek.nl/vendor.bundle.js:40634:21) [<root>]originalStack: "Error: Invalid provider - only instances of Provider and Type are allowed, got: undefined↵    at ZoneAwareError (http://beterfysiek.nl/vendor.bundle.js:107261:33)↵    at InvalidProviderError.BaseError [as constructor] (http://beterfysiek.nl/vendor.bundle.js:7029:27)↵    at new InvalidProviderError (http://beterfysiek.nl/vendor.bundle.js:59093:16)↵    at http://beterfysiek.nl/vendor.bundle.js:42468:19↵    at Array.forEach (native)↵    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15)↵    at http://beterfysiek.nl/vendor.bundle.js:42465:13↵    at Array.forEach (native)↵    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15)↵    at resolveReflectiveProviders (http://beterfysiek.nl/vendor.bundle.js:42408:39)↵    at Function.ReflectiveInjector.resolve (http://beterfysiek.nl/vendor.bundle.js:82535:127)↵    at Function.ReflectiveInjector.resolveAndCreate (http://beterfysiek.nl/vendor.bundle.js:82566:79)↵    at JitCompilerFactory.createCompiler (http://beterfysiek.nl/vendor.bundle.js:76275:107)↵    at PlatformRef_._bootstrapModuleWithZone (http://beterfysiek.nl/vendor.bundle.js:40647:57)↵    at PlatformRef_.bootstrapModule (http://beterfysiek.nl/vendor.bundle.js:40634:21)"zoneAwareStack: "Error: Invalid provider - only instances of Provider and Type are allowed, got: undefined↵    at InvalidProviderError.BaseError [as constructor] (http://beterfysiek.nl/vendor.bundle.js:7029:27) [<root>]↵    at new InvalidProviderError (http://beterfysiek.nl/vendor.bundle.js:59093:16) [<root>]↵    at http://beterfysiek.nl/vendor.bundle.js:42468:19 [<root>]↵    at Array.forEach (native) [<root>]↵    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15) [<root>]↵    at http://beterfysiek.nl/vendor.bundle.js:42465:13 [<root>]↵    at Array.forEach (native) [<root>]↵    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15) [<root>]↵    at resolveReflectiveProviders (http://beterfysiek.nl/vendor.bundle.js:42408:39) [<root>]↵    at Function.ReflectiveInjector.resolve (http://beterfysiek.nl/vendor.bundle.js:82535:127) [<root>]↵    at Function.ReflectiveInjector.resolveAndCreate (http://beterfysiek.nl/vendor.bundle.js:82566:79) [<root>]↵    at JitCompilerFactory.createCompiler (http://beterfysiek.nl/vendor.bundle.js:76275:107) [<root>]↵    at PlatformRef_._bootstrapModuleWithZone (http://beterfysiek.nl/vendor.bundle.js:40647:57) [<root>]↵    at PlatformRef_.bootstrapModule (http://beterfysiek.nl/vendor.bundle.js:40634:21) [<root>]"message: "Invalid provider - only instances of Provider and Type are allowed, got: undefined"stack: "Error: Invalid provider - only instances of Provider and Type are allowed, got: undefined↵    at InvalidProviderError.BaseError [as constructor] (http://beterfysiek.nl/vendor.bundle.js:7029:27) [<root>]↵    at new InvalidProviderError (http://beterfysiek.nl/vendor.bundle.js:59093:16) [<root>]↵    at http://beterfysiek.nl/vendor.bundle.js:42468:19 [<root>]↵    at Array.forEach (native) [<root>]↵    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15) [<root>]↵    at http://beterfysiek.nl/vendor.bundle.js:42465:13 [<root>]↵    at Array.forEach (native) [<root>]↵    at _normalizeProviders (http://beterfysiek.nl/vendor.bundle.js:42457:15) [<root>]↵    at resolveReflectiveProviders (http://beterfysiek.nl/vendor.bundle.js:42408:39) [<root>]↵    at Function.ReflectiveInjector.resolve (http://beterfysiek.nl/vendor.bundle.js:82535:127) [<root>]↵    at Function.ReflectiveInjector.resolveAndCreate (http://beterfysiek.nl/vendor.bundle.js:82566:79) [<root>]↵    at JitCompilerFactory.createCompiler (http://beterfysiek.nl/vendor.bundle.js:76275:107) [<root>]↵    at PlatformRef_._bootstrapModuleWithZone (http://beterfysiek.nl/vendor.bundle.js:40647:57) [<root>]↵    at PlatformRef_.bootstrapModule (http://beterfysiek.nl/vendor.bundle.js:40634:21) [<root>]"__proto__: Object__proto__: BaseError
(anonymous) @ vendor.bundle.js:42468
_normalizeProviders @ vendor.bundle.js:42457
(anonymous) @ vendor.bundle.js:42465
_normalizeProviders @ vendor.bundle.js:42457
resolveReflectiveProviders @ vendor.bundle.js:42408
ReflectiveInjector.resolve @ vendor.bundle.js:82535
ReflectiveInjector.resolveAndCreate @ vendor.bundle.js:82566
JitCompilerFactory.createCompiler @ vendor.bundle.js:76275
PlatformRef_._bootstrapModuleWithZone @ vendor.bundle.js:40647
PlatformRef_.bootstrapModule @ vendor.bundle.js:40634
516 @ main.bundle.js:2053
__webpack_require__ @ inline.bundle.js:53
1118 @ main.bundle.js:6
__webpack_require__ @ inline.bundle.js:53
webpackJsonpCallback @ inline.bundle.js:24
(anonymous) @ main.bundle.js:1

我的app.module

  import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { routing } from "./app.routing";
import { HashLocationStrategy, LocationStrategy } from '@angular/common';
import { IntakeFormulierModule } from './intake-formulier/intake-formulier.module';
import { HomeModule } from './home/home.module';
import { AngularFireModule, AuthProviders, AuthMethods } from 'angularfire2';
import { firebaseConfig } from '../environments/firebase.config';
import { CookiesComponent } from './cookies/cookies.component';

const myFirebaseAuthConfig = {
  provider: AuthProviders.Password,
  method: AuthMethods.Password
};

@NgModule({
  declarations: [
    AppComponent,
    CookiesComponent,
  ],
  imports: [
    routing,
    HomeModule,
    IntakeFormulierModule,
    AngularFireModule.initializeApp(firebaseConfig, myFirebaseAuthConfig),
    BrowserModule
  ],
  providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 1

我使用了ng build --aot，它给了我ng build没有的错误。

我遇到了一个字体问题，因为它仍然是0.8.0版本，而且必须是0.9.0。我在我的package.json文件中更新了它，然后我又重新联机了！