Angular2 rc4 bootstrap

时间:2016-07-09 16:21:36

标签: angular angular2-routing

我刚刚将RC2的angular2应用程序更新为RC4。我已经完全按照指南进行了操作,但由于一些奇怪的原因,在我的main.ts文件中引导应用程序无效。我的代码是:

import  { bootstrap } from '@angular/platform-browser-dynamic';

import { enableProdMode }    from '@angular/core';

import { APP_ROUTER_PROVIDERS } from './service/routes.service';

import { AppComponent }   from './components/app.component';

enableProdMode();

bootstrap(AppComponent, [
    APP_ROUTER_PROVIDERS,
]); 

我收到错误消息:

  

[ts]模块   ' “/用户/ bradbeighton /文件/开发/ coffeezan / node_modules / @角/平台的浏览器的动态/索引”'   没有导出的成员'bootstrap'。导入bootstrap

"@angular/common": "2.0.0-rc.4",
"@angular/compiler": "2.0.0-rc.4",
"@angular/core": "2.0.0-rc.4",
"@angular/forms": "0.2.0",
"@angular/http": "2.0.0-rc.4",
"@angular/platform-browser": "2.0.0-rc.4",
"@angular/platform-browser-dynamic": "2.0.0-rc.4",
"@angular/router": "3.0.0-beta.1",
"@angular/router-deprecated": "2.0.0-rc.2",
"@angular/upgrade": "2.0.0-rc.4",

我安装的软件包与Angular建议的软件包完全相同。所以我很困惑为什么没有找到bootstrap模块?

我在设置路由时遇到了另一个问题,就像他们在教程中建议的那样。

import { provideRouter, RouterConfig }  from '@angular/router';

import { HomeComponent } from '../components/home.component/home.component';';

const routes: RouterConfig = [
  { path: '/home', component: HomeComponent },
];

export const APP_ROUTER_PROVIDERS = [
  provideRouter(routes)
]; 

我不知道我是不是在这里愚蠢或者我是否安装了错误的包裹?请帮忙??

编辑:

我的systemjs.config文件非常标准,但它是:

var isPublic = typeof window != "undefined";

/**
 * System configuration for Angular 2 samples
 * Adjust as necessary for your application needs.
 */
(function(global) {
    // map tells the System loader where to look for things
    var map = {
        'app':                        'client', // 'dist',
        '@angular':                   (isPublic)? '@angular' : 'node_modules/@angular',
        'angular2-in-memory-web-api': (isPublic)? 'angular2-in-memory-web-api' : 'node_modules/angular2-in-memory-web-api',
        'rxjs':                       (isPublic)? 'rxjs' : 'node_modules/rxjs',
        'ng-semantic':                (isPublic)? 'ng-semantic' : 'node_modules/ng-semantic'
    };
    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        'app':                        { main: 'main.js',  defaultExtension: 'js' },
        'rxjs':                       { defaultExtension: 'js' },
        'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
        'ng-semantic':                { main: 'ng-semantic', defaultExtension: 'js' }
    };
    var ngPackageNames = [
        'common',
        'compiler',
        'core',
        'http',
        'platform-browser',
        'platform-browser-dynamic',
        'router',
        'router-deprecated',
        'upgrade'
    ];
    // Add package entries for angular packages
    ngPackageNames.forEach(function(pkgName) {
        packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
    });
    var config = {
        map: map,
        packages: packages
    };
    System.config(config);
})(this);

1 个答案:

答案 0 :(得分:0)

引用 .umd.js 文件时,您需要使用捆绑。请参考下面的块 -

  function packUmd(pkgName) {
    packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
  }

看看这是否有帮助。