2016-06-22 10 views
0

私のangular2アプリケーションを推奨されていないルータから推奨ルータに切り替えることを試みています[https://angular.io/docs/ts/latest/guide/router.html][1].I angular2 cliの助けを借りてプロジェクトをビルドしています。アイブ氏は、成功したCLIなしシードプロジェクトでこれを行ったが、CLIでこれをやったときに、私はこのエラーを得続ける:Angular2は経路をロードしていません

Error loading http://localhost:4200/app.routes as "./app.routes" from http://localhost:4200/main.js " ; Zone: ; Task: Promise.then ; Value: Error: patchProperty/desc.set/[email protected]http://localhost:4200/vendor/zone.js/dist/zone.js:769:27 Zonehttp://localhost:4200/vendor/zone.js/dist/zone.js:356:24 Zonehttp://localhost:4200/vendor/zone.js/dist/zone.js:256:29 ZoneTask/[email protected]http://localhost:4200/vendor/zone.js/dist/zone.js:423:29 Error loading http://localhost:4200/app.routes as "./app.routes" from http://localhost:4200/main.js

これは私のmain.tsファイルです。

import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { enableProdMode } from '@angular/core'; 
import { AppComponent, environment } from './app/'; 
import { APP_ROUTER_PROVIDERS } from './app.routes'; 

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

bootstrap(AppComponent, [APP_ROUTER_PROVIDERS]) 
    .catch(err => console.error(err)); 

これは私のapp.routes.tsが

import { provideRouter, RouterConfig } from '@angular/router'; 
import {Main} from "./app/splash_app/main.component"; 
import {Whatsup} from "./app/splash_app/whatsup.component"; 
import {LocalBus} from "./app/splash_app/localbus.component"; 
import {Login} from "./app/splash_app/login.component"; 

export const routes: RouterConfig = [ 
    { path: 'main', component: Main }, 
    { path: 'search', component: Whatsup }, 
    { path: 'local-business', component: LocalBus }, 
    {path: 'guest-login', component: Login} 
]; 

export const APP_ROUTER_PROVIDERS = [ 
    provideRouter(routes) 
]; 

を提出。これは、システム-configファイル

// SystemJS configuration file, see links for more information 
// https://github.com/systemjs/systemjs 
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md 

/*********************************************************************************************** 
* User Configuration. 
**********************************************************************************************/ 
/** Map relative paths to URLs. */ 
const map: any = { 
}; 

/** User packages configuration. */ 
const packages: any = { 

}; 

//////////////////////////////////////////////////////////////////////////////////////////////// 
/*********************************************************************************************** 
* Everything underneath this line is managed by the CLI. 
**********************************************************************************************/ 
const barrels: string[] = [ 
    // Angular specific barrels. 
    '@angular/core', 
    '@angular/common', 
    '@angular/compiler', 
    '@angular/http', 
    '@angular/router', 
    '@angular/platform-browser', 
    '@angular/platform-browser-dynamic', 


    // Thirdparty barrels. 
    'rxjs', 

    // App specific barrels. 
    'app', 
    'app/shared', 
    /** @cli-barrel */ 
]; 

const cliSystemConfigPackages: any = {}; 
barrels.forEach((barrelName: string) => { 
    cliSystemConfigPackages[barrelName] = { main: 'index' }; 
}); 

/** Type declaration for ambient System. */ 
declare var System: any; 

// Apply the CLI SystemJS configuration. 
System.config({ 
    map: { 
    '@angular': 'vendor/@angular', 
    'rxjs': 'vendor/rxjs', 
    'main': 'main.js' 
    }, 
    packages: cliSystemConfigPackages 
}); 

// Apply the user's configuration. 
System.config({ map, packages }); 

main.tsファイルとapp.routes.tsファイルの両方ですsrcフォルダにあります。

+0

あなたSystemjs設定はどのようなものですか? –

+0

私はSystemjsファイルを投稿しました。 – Dan

答えて

0
あなた appディレクトリに移動し

app.routes.tsファイル、その後main.ts内のインポートが新しいパスを指すように変更....

import { APP_ROUTER_PROVIDERS } from './app/app.routes'; 
+0

はい!ありがとう、それはトリックでした! – Dan

関連する問題