Angular2 加载时文件请求过多

我正在制作一个网站Angular2我遇到了我认为的问题。在我的角度页面第一次加载时，SystemJS正在发出超过 50000 个请求来检索每个Angular2文件输入angular2/src目录。总共，第一次加载下载超过 4MB，启动时间超过 14 秒。

My index.html以下脚本是否包括：

<script src="libs/angular2/bundles/angular2-polyfills.js"></script>
<script src="libs/systemjs/dist/system.src.js"></script>
<script src="libs/rxjs/bundles/Rx.js"></script>
<script src="libs/angular2/bundles/angular2.min.js"></script>
<script src="libs/angular2/bundles/http.dev.js"></script>
<script src="libs/jquery/jquery.js"></script>
<script src="libs/lodash/lodash.js"></script>
<script src="libs/bootstrap/js/bootstrap.js"></script>

我的 systemJs 初始化代码如下所示：

    <script>
      System.config({
        defaultJSExtensions: true,
        paths: {
          '*': 'libs/*',
          'app/*': 'app/*'
        },
        packageConfigPaths: ['libs/*/package.json'],
        packages: {
          app: {
            format: 'register',
            defaultExtension: 'js'
          }
        }
      });
      System.import('app/main')
            .then(null, console.error.bind(console));

    </script>

我的公用文件夹具有以下结构：

.
├── img
├── styles
├── app
├── libs
|   └── angular2
|   └── systemjs
|   └── rxjs
|   └── jquery
|   └── lodash
|   └── bootstrap
└── index.html

A couple of screenshots of some of the js files that are being requested:

有没有办法避免所有这些请求？

我遇到了完全相同的问题，实际上正在查看这篇文章以寻求答案。这是我为解决问题所做的事情。

1. 修改您的项目以使用 webpack。请遵循这个简短的教程：Angular2 快速入门 SystemJS 到 Webpack
2. 此方法将为您提供一个 javascript 文件，但它非常大（我的项目文件超过 5MB）并且需要缩小。为此，我全局安装了 webpack：npm install webpack -g。安装后，运行webpack -p从您的应用程序根目录。这使我的文件大小减少到大约 700KB

从 20 秒和 350 个请求减少到 3 秒和 7 个请求。