Angular2&SystemJS:在构buildmoduleLoader时找不到模块

什么是上下文?

我正在使用SystemJS,Angular2和@ ngrx / store开展一个项目。 目前,我试图做一个简单的模块加载器。

它运作良好。 这是事情:

  • 我在它自己的文件夹中编写一个名为“ namespace @ moduleName ”的“模块”。
  • 我将这个文件夹添加到另一个命名modules
  • 当我的应用程序启动时,我的ModuleLoader (基本上通过import {} from 'namespace@moduleName提供的模块可以请求一个服务器API(使用Node)。
  • 在这个API旁边,启动一个脚本。 使用FS ,我正在阅读modules文件夹的内容,以响应一些关于模块的数据(哪些模块被安装,版本是什么)。
  • 回到ModuleLoader,我读取这些信息并configurationSystemJS来添加这些模块(使用mappackage )。
  • ModuleLoader的工作已经结束。 我可以用System.import('core/app').then(null, console.error.bind(console));启动我的应用程序System.import('core/app').then(null, console.error.bind(console));

我的应用程序启动。 这很简单吧?

core/app是指public/core/components/app.component.ts这是我的引导组件Angular 2。

有什么问题?

一切工作正常之前,我更新我的代码。 我遇到了Angular 2,所以我的app.component.ts看起来像这样:

 import { Component, View } from "angular2/core"; import { RouteConfig, ROUTER_DIRECTIVES, Router } from "angular2/router"; import { Devtools } from '@ngrx/devtools'; import { Store } from '@ngrx/store'; import { HomeComponent } from "./home.component"; import { NavComponent } from "./nav.component"; import { MediasComponent } from "./medias.component"; import { changeUrl } from '../actions/locationActions'; import { Store as AppStore } from '../stores/store'; @Component({ selector: 'app-view' }) @View({ directives: [ Devtools, ROUTER_DIRECTIVES, NavComponent ], template: ` <ngrx-devtools></ngrx-devtools> <h1>App</h1> <nav-cmp></nav-cmp> <router-outlet></router-outlet> ` }) @RouteConfig([ { path: '/home', name: 'Home', component: HomeComponent, useAsDefault: true }, { path: '/medias', name: 'Medias', component: MediasComponent } ]) export class AppComponent { constructor (private router:Router, private store:Store<AppStore>) { router.subscribe(url => store.dispatch(changeUrl(url))); } } 

这非常简单,我加载组件并设置了一个非常基本的应用程序。 我的HomeComponent在同一个文件夹( public/core/components/home.component.ts ),并使用我的ModuleLoader提供的模块

 // A simple module loaded by the Home. I wonder what this modules does... import { CounterComponent } from 'test@counter'; 

但是app.component.ts已经改变了!

我希望我的应用程序可以通过模块构build。 所以我决定用模块(component @ main,component @ home,component @ medias …)重写这个AppComponent。

我只想在AppComponent中包含我的component @ main模块,而这个模块是'模块的核心'。

但是失败了。

Atm,我的AppComponent看起来像这样:

 import { Component, View } from "angular2/core"; import { Devtools } from '@ngrx/devtools'; import { MainComponent } from 'component@main'; @Component({ selector: 'app-view' }) @View({ directives: [ Devtools ], template: ` <ngrx-devtools></ngrx-devtools> <main-cmp></main-cmp> ` }) export class AppComponent { } 

这是伟大的。 但是现在我的shell里面有很多错误(不在浏览器中)。

 [0] public/src/core/components/app.component.ts(40,31): error TS2307: Cannot find module 'component@main'. [0] public/src/modules/component@home/src/home.component.ts(2,34): error TS2307: Cannot find module 'test@counter/components'. [0] public/src/modules/component@main/src/main.component.ts(5,31): error TS2307: Cannot find module 'component@home'. [0] public/src/modules/component@main/src/main.component.ts(6,30): error TS2307: Cannot find module 'component@nav'. [0] public/src/modules/component@main/src/main.component.ts(7,33): error TS2307: Cannot find module 'component@medias'. [0] public/src/modules/component@main/src/main.component.ts(8,27): error TS2307: Cannot find module 'core/actions/locationActions'. 

等等。

我不明白为什么我的模块不成立。 当我debuggingSystem ,configuration是正确的。 System.map映射的path和System.packages都有正确的包。

我的应用程序是一个空白的屏幕(只有@ ngrx / devtools), 没有日志输出。

你有什么主意吗 ? 如果需要,我可以承诺我的项目,并与您分享回购。

感谢阅读这个烦人的问题:-D

我只是发现我的错误。

我只需要在我的AppComponent的指令中注入MainComponent。

我在这里留下这个问题,以防你对我的工作stream程有一些build议。

这个子问题是,我怎样才能删除这些日志? 他们真的很容易出错。