angular - 让 SystemJS 使用 angular2 包？

Question

我正在尝试在 Chrome 扩展中使用 angular2，但它没有识别出我已经加载了 angular2 包。这是文件 /www/popup.html 中我的脚本标记:

<script src="lib/js/jquery.min.js"></script>
<script src="lib/js/es6-shim.min.js"></script>
<script src="lib/js/system-polyfills.js"></script>
<script src="lib/js/angular2-polyfills.js"></script>
<script src="lib/js/system.src.js"></script>

<!-- bundles should be used -->
<script src="lib/js/Rx.js"></script>
<script src="lib/js/angular2.dev.js"></script>
<script src="lib/js/router.dev.js"></script>

<script src="app/pages/popup-page.js"></script>

在 /www/app/pages/popup-page.js 中，如果我设置 angular2 和 rxjs 源的路径，它将起作用:

System.config({
  defaultJSExtensions: true, // Will prepend .js to the module names

  paths: {
    'angular2/*': '/node_modules/angular2/*', // finds
    'rxjs/*': '/node_modules/rxjs/*',         // finds
    '*': '/www/app/*'
  },
  packages: {
    "app": {
      format: 'register',
      defaultExtension: 'js',
    }
  }
});

但我不想让它单独加载每个 javascript 文件，甚至不想将它们包含在我的扩展中。看起来这些包应该在脚本加载时自行注册。

1. 如果我不包含代码所在的路径“*”，则会在尝试运行脚本时收到“require is not Define”的消息。

2. 如果我不包含 angular2 和 rxjs 的路径，浏览器会尝试为每次导入加载“/www/app/angular2/...”，而不是使用 bundle

Answer 1

如果您加载包含通过 <script> 注册为系统模块的模块的包标签，您不需要 System.config 中的任何其他内容- 它将通过内存中的注册名称解析导入。

通过包含 <script src="lib/js/angular2.dev.js"></script>在您的 html 文件中导入语句，如 import {Component} from 'angular2/core'无需任何额外配置即可工作。

正在删除path选项来自 System.config应该解决 Angular 导入的问题。 ( '*': '/www/app/*' - 此行基本上将所有内容映射到 /www/app 文件夹...)。

要设置您自己的脚本的路径，请使用 map System.config.package["app"] 中的选项, more info here .