使用 systemJs 加载 angular2 库答案

【问题标题】：Loading angular2 library using systemJs使用 systemJs 加载 angular2 库
【发布时间】：2016-07-07 08:03:06
【问题描述】：

我正在关注来自 angular.io 的 Angular2 快速入门指南他们利用 systemJs 来加载应用程序。

angular2、rx.js 和 angular2.dev.js 是通过脚本引用加载的，而不是导入 ..

有没有办法导入这些脚本？

    <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>
    <script src="node_modules/rxjs/bundles/Rx.js"></script>
    <script src="node_modules/angular2/bundles/angular2.dev.js"></script>

    <!-- 2. Configure SystemJS -->
    <script>
      System.config({
        packages: {        
          app: {
            format: 'register',
            defaultExtension: 'js'
          }
        }
      });
      System.import('app/main')
            .then(null, console.error.bind(console));
    </script>
  </head>

  <!-- 3. Display the application -->
  <body>
    <app>Loading...</app>
  </body>

【问题讨论】：

标签： angular systemjs

【解决方案1】：

包含 Angular2 包直接使用 System.register 方法注册其包。

也就是说，您还可以配置 SystemJS 以使用以下配置为每个模块按文件加载 Angular2 文件，但效率较低：

<script src="node_modules/es6-promise/dist/es6-promise.js"></script>
<script src="node_modules/es6-shim/es6-shim.js"></script>

<script src="node_modules/angular2/bundles/angular2-polyfills.min.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>

<script>
  System.config({
    defaultJSExtensions: true,
    map: {
      angular2: 'node_modules/angular2/src',
      rxjs: 'node_modules/rxjs'
    },
    packages: {
      app: {
        defaultExtension: 'js',
        format: 'register'
      },
      angular2: {
        defaultExtension: 'js',
      }
    }
  });
  (...)
</script>

在这两种情况下，都可以在您的应用程序中导入相应的模块（angular2/*、rxjs/*）。

【讨论】：

你为什么不从 node_modules/angular2/bundles/angular2-polyfills.min.js 加载 Angular 的 polyfill？
非常感谢@CosminAbabei 指出这一点！你完全正确。我相应地更新了我的答案......
此解决方案失败并出现以下错误“system.src.js:1085 GET localhost:3000/node_modules/angular2/src/platform/browser.js” 我注意到平台文件夹中没有 browser.js 文件
抱歉是angular2: 'node_modules/angular2' 而不是angular2: 'node_modules/angular2/src'