我的routes.ts文件是这样的：

import {
  provideRouter,Routes,RouterModule
}
from '@angular/router';
import {
  OverviewComponent,LoginComponent,ProfileComponent
} from './shared';
import { AuthGuard } from './auth.guard';
import { HasToken } from './common/index';

const routes: Routes = [
  {
    path: '',component: OverviewComponent,canActivate: [AuthGuard]
  },{
    path: 'login',component: LoginComponent
  },{
    path: 'profile',component: ProfileComponent,{
    path: '**',redirectTo: '/login'
  }
];

export const authProviders = [AuthGuard,HasToken];

export const appRouterProviders = [
  provideRouter(routes),authProviders
];

export const routing = RouterModule.forRoot(routes);

而我的app.module.ts文件(bootstrap)就是这样的：

import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import {NgModule} from '@angular/core';
import {RouterModule} from '@angular/router';
import {BrowserModule} from '@angular/platform-browser';
import { AppComponent } from './app.component';
import {appRouterProviders,routing} from './routes';
import {
  OverviewComponent,ProfileComponent
} from './shared';

@NgModule({
  declarations: [
    AppComponent,OverviewComponent,ProfileComponent
  ],imports: [
    BrowserModule,CommonModule,// Router
    routing,// Forms
    FormsModule,],providers: [
      appRouterProviders,provide(AuthHttp,{
         useFactory: (http) => {
           return new AuthHttp(new AuthConfig({
             headerName: 'Authorization',headerPrefix: 'Bearer',tokenName: 'token',tokenGetter: (() => localStorage.getItem('token')),globalHeaders: [{'Content-Type': 'application/json'}],noJwtError: false,noTokenScheme: false
           }),http);
          },deps: [Http]
       })
     ],entryComponents: [AppComponent],bootstrap: [AppComponent]
})

export class AppModule {

}

最后我的录入文件(main.ts)是这样的：

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode,provide } from '@angular/core';
import { Http } from '@angular/http';
import { AuthHttp,AuthConfig } from 'angular2-jwt';
import { AppModule,environment } from './app/';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

所以当我运行ng-serve(它是一个角色cli与webpack项目)我得到这个错误在控制台：

EXCEPTION: Error: Invalid configuration of route ‘ ‘: one of the following must be provided (component or redirectTo or children or loadChildren)

更新代码和新错误

Uncaught Unexpected value ‘undefined’ declared by the module ‘AppModule’

最新更新

桶似乎有问题.如果我将组件导入到app.module中,它会绕过此错误,但是提供另一个：

uri.match is not a function

我当然试图在路由中添加pathMatch属性,但没有改变.