router_1.provideRouter在尝试运行Angular2 / NodeJS应用程序时不是函数
我创build了一个简单的NodeJS / Angular2应用程序，当我尝试访问应用程序的入口点页面时遇到以下错误：
router_1.provideRouter is not a function 我不确定这个错误是什么意思，也不知道从哪里开始。 有没有人有任何见解或想法为什么这可能会发生？ 这里是我的package.json文件（因为我认为这可能是与一个Angular软件包有关）
{ "name": "udemy-nodejs-angular2", "version": "1.0.0", "private": true, "scripts": { "start": "concurrently tsc -w && nodemon ./bin/www", "vendor": "gulp vendor", "gulp": "npm run vendor && gulp", "postinstall": "typings install", "typings": "typings" }, "dependencies": { "@angular/common": "^2.0.0-rc.2", "@angular/compiler": "^2.0.0-rc.2", "@angular/core": "^2.0.0-rc.2", "@angular/http": "2.0.0-rc.2", "@angular/platform-browser": "^2.0.0-rc.2", "@angular/platform-browser-dynamic": "^2.0.0-rc.2", "@angular/router": "3.0.0-beta.2", "@angular/upgrade": "2.0.0-rc.2", "body-parser": "~1.13.2", "cookie-parser": "~1.3.5", "debug": "~2.2.0", "es6-shim": "^0.35.0", "express": "~4.13.1", "hbs": "~3.1.0", "morgan": "~1.6.1", "reflect-metadata": "^0.1.3", "rxjs": "^5.0.0-beta.6", "serve-favicon": "~2.3.0", "systemjs": "0.19.27", "zone.js": "^0.6.12" }, "devDependencies": { "concurrently": "^2.2.0", "gulp": "^3.9.0", "gulp-sourcemaps": "^1.6.0", "gulp-typescript": "^2.10.0", "nodemon": "^1.9.2", "typings": "^0.8.1" } }
和我的SystemJSconfiguration：
// map tells the System loader where to look for things var map = { 'app': 'js/app', // 'dist', 'rxjs': 'js/vendor/rxjs', '@angular': 'js/vendor/@angular' }; // packages tells the System loader how to load when no filename and/or no extension var packages = { 'app': {main: 'boot.js', defaultExtension: 'js'}, 'rxjs': {defaultExtension: 'js'} }; var packageNames = [ '@angular/common', '@angular/compiler', '@angular/core', '@angular/http', '@angular/platform-browser', '@angular/platform-browser-dynamic', '@angular/router', '@angular/testing', '@angular/upgrade' ]; // add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' } packageNames.forEach(function (pkgName) { packages[pkgName] = {main: 'index.js', defaultExtension: 'js'}; }); var config = { map: map, packages: packages }; System.config(config);
这里是我使用路由器function的地方：
app.routes.ts
import {provideRouter, RouterConfig} from '@angular/router'; import {LoginComponent} from "./components/login/login.component"; import {DashboardComponent} from "./components/dashboard/dashboard.component"; export const routes: RouterConfig = [ { path: 'login', component: LoginComponent }, { path: 'dashboard', component: DashboardComponent } ]; export const APP_ROUTER_PROVIDERS = [ provideRouter(routes) ];
boot.ts：
import {bootstrap} from '@angular/platform-browser-dynamic'; import {AppComponent} from "./app.component"; import { APP_ROUTER_PROVIDERS } from './app.routes'; bootstrap(AppComponent, [ APP_ROUTER_PROVIDERS ]) .catch(err => console.error(err));
app.component.ts
import { Component } from '@angular/core'; import { ROUTER_DIRECTIVES } from '@angular/router'; @Component({ moduleId: module.id, selector: 'my-app', templateUrl: 'app.template.html', directives: [ ROUTER_DIRECTIVES ] }) export class AppComponent { }
谢谢
正如我们在聊天中发现的那样，问题是供应商文件夹中的路由器没有更新到新版本。
为了解决这个问题，必须删除vendor文件夹下的路由器，然后运行npm install，最后运行nulp gulp重新创buildvendor文件夹。