Question

当我将路由器添加到配置时，Angular2 systemjs配置失败：

var map = {
'app':                        'app', // 'dist',
'@angular':                   'core/@angular',
'@angular/router':            'core/@angular/router',
'angular2-in-memory-web-api': 'core/angular2-in-memory-web-api',
'rxjs':                       'core/rxjs'
};
// packages tells the System loader how to load when no filename and/or no extension
var packages = {
'app':                        { main: 'main.js',  defaultExtension: 'js' },
'@angular/router': { main: 'index.js', defaultExtension: 'js' },
'rxjs':                       { defaultExtension: 'js' },
'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
};

错误是：

Error: TypeError: router_1.provideRouter is not a function(…)

什么是正确的配置？

我将systemjs配置更改为不再指定路由器。现在我可以确认正在复制整个文件夹。

app / config / app.routes.ts中的代码是：

import { RouterConfig, provideRouter } from '@angular/router';
import { HomeComponent } from '../components/home/home.component';

export const routes: RouterConfig = [
  { path: 'who', component: HomeComponent }
];

export const APP_ROUTER_PROVIDER = [
  provideRouter(routes)
];

然后在app / main.ts中我有：

import { bootstrap } from '@angular/platform-browser-dynamic';
import { LayoutComponent } from './components/layout/layout.component';
import { APP_ROUTER_PROVIDER } from './config/app.routes';

bootstrap(LayoutComponent, [
  APP_ROUTER_PROVIDER
])
.catch(err => console.error(err));

这对我来说似乎是正确的，因为所有教程代码都在那里。

我的项目结构如下：

node_modules/
public_html/
- app/
- index.html
- system.config.js
typings/
tsconfig.json
typings.json

Answer 1

我犯了两个关键错误导致这个问题。

已更新至最新的角度依赖关系，无需重新配置或重建。
我的打字和其他项目配置被移动了。

我通过将配置移动到同一文件夹来解决上述问题。 /public_html。并在那里安装节点模块。

这引起了事情被打破的问题。我根据最新的ng教程（快速入门）进行了重新配置。现在还有一个问题。我不得不将rxjs升级到"rxjs": "^5.0.0-beta.10"并重新安装。然后安装它的依赖关系，并在我将其添加到systemjs时看到如下：

npm install symbol-observable@1.0.1 --save-dev

现在唯一剩下的就是不再创建核心文件了。所以我直接引用了node_modules，就像在教程中一样。

html：

<script src="/node_modules/core-js/client/shim.min.js"></script>
<script src="/node_modules/zone.js/dist/zone.js"></script>
<script src="/node_modules/reflect-metadata/Reflect.js"></script>
<script src="/node_modules/systemjs/dist/system.src.js"></script>

systemjs：

/**
 * 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':                        'app', // 'dist',
    '@angular':                   'node_modules/@angular',
    '@angular/router':            'node_modules/@angular/router',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'symbol-observable':          'node_modules/symbol-observable',
    'rxjs':                       'node_modules/rxjs'
  };
  // 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' },
    'symbol-observable':          { main: 'index.js', defaultExtension: 'js' },
  };
  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade',
  ];
  // Individual files (~300 requests):
  function packIndex(pkgName) {
    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }
  // Bundled (~40 requests):
  function packUmd(pkgName) {
    packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
  }
  // Most environments should use UMD; some (Karma) need the individual index files
  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
  // Add package entries for angular packages
  ngPackageNames.forEach(setPackageConfig);
  var config = {
    map: map,
    packages: packages
  };
  System.config(config);
})(this);

Angular2 Router@3.0.0-beta.s抛出与systemjs相关的错误

1 个答案: