初始问题
不确定这是否是一个合适的问题，但我在为Angular设置快速启动教程时遇到了这个问题。
我正在使用gulp作为tsc，捆绑和托管（gulp-）Web服务器。
我在gullfile.js中的tsc gull任务看起来是这样的：
var gulpTypescript = require('gulp-typescript');
var tscConfig = require('./tsconfig.json');
gulp.task('tsc', function () {
return gulp.src('src/**/*.ts')
.pipe(gulpTypescript(tscConfig.compilerOptions))
.pipe(gulp.dest('/gen'));
});
main.ts看起来是这样的（这是Angular2 Quickstart提供的）：
import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from './app.component';
bootstrap(AppComponent);
这个任务生成两个.js文件，我将它们与gull bundle资产连接到最终的main.js中
我最后捆绑的main.js看起来是这样的（缩写）：
System.register(['angular2/core'], function(exports_1, context_1) {
var __moduleName = context_1 && context_1.id;
..
}};
System.register(['angular2/platform/browser', './app.component'], function(exports_1, context_1) {
var __moduleName = context_1 && context_1.id;
..
}};
铬控制台给我以下错误：
错误：模块中有多个匿名System.register调用https://localhost:8000/lib/main.js.如果加载捆绑包，请确保所有System.register调用都已命名。
所以实际上我不知道main.js出了什么问题。也许其他人出了问题？
新问题（解决上一个问题后）
Chrome中不再显示控制台错误日志-这很酷，但Angular模块仍然没有加载。。
我想System.js加载程序和我捆绑的main.js文件有问题（实际上不是编译的main.ts文件-它是捆绑的main.js+app.component.js文件-重命名可能很好…）
我的index.html看起来是这样的：
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>index.html</title>
<link rel="stylesheet" href="./lib/main.css">
<script type="text/javascript" src="lib/vendor.js"></script>
<script>
System.config({
packages: {
lib: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('lib/main')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>
build/-目录（gulp-webserver的根目录）的结构如下：
- 构建/
- lib/
- 地图/
- main.css
- main.js
- vendor.js//捆绑的node_module-files
- index.html
- lib/
当我将main.js拆分为main.js+app.component.js（并修改index.html中的引用）时，Angular Module加载良好。
您的问题在于连接级别。事实上，您不能使用gull bundle资产来连接JS文件（从TypeScript文件编译而来的文件）。
您应该使用tsc编译器的outFile选项（请参阅tscConfig.compilerOptions）。它将把你所有的TypeScript文件编译成一个JS文件。在这种情况下，模块名称将在注册时明确定义：
System.register('app/component', ['angular2/core'], function(exports_1, context_1) {
var __moduleName = context_1 && context_1.id;
..
}};
System.register('app/main', ['angular2/platform/browser', './app.component'], function(exports_1, context_1) {
var __moduleName = context_1 && context_1.id;
..
}};
而不是：
System.register(['angular2/core'], function(exports_1, context_1) {
var __moduleName = context_1 && context_1.id;
..
}};
System.register(['angular2/platform/browser', './app.component'], function(exports_1, context_1) {
var __moduleName = context_1 && context_1.id;
..
}};