systemjs-builder

Question

我有一个 Angular2 应用程序，在开发环境中运行良好。所有 Angular2 依赖项都在运行时间内从 node_modules 目录加载。

我使用 gulp-typescript 插件来捆绑应用程序代码，并使用 system-js 来捆绑第三方库代码。

这是 gulp 捆绑 lib 文件的任务：

function bundleLibs() {
  var files = [
    'node_modules/rxjs/bundles/Rx.js',
    'node_modules/@angular/core/bundles/core.umd.js',
    'node_modules/@angular/forms/bundles/forms.umd.js',
    'node_modules/@angular/common/bundles/common.umd.js',
    'node_modules/@angular/compiler/bundles/compiler.umd.js',
    'node_modules/@angular/platform-browser/bundles/platform-browser.umd.js',
    'node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
    'node_modules/@angular/upgrade/bundles/upgrade-static.umd.js'
  ];

  var builder = new SystemJSBuilder('dist', {
    map: {
      'rxjs': 'node_modules/rxjs'
    }
  });

  return builder.bundle(files, 'dist/js/lib.js');
}

我希望所有 rxjs 库都包含在输出文件中。但是当我运行应用程序时，我得到

的 404 状态

node_modules/rxjs/Subject.js
node_modules/rxjs/Observable.js

（以及所有其他 rxjs 文件）。

它有助于捆绑每个单独的 rxjs 文件：

var files = [
'node_modules/@angular/core/bundles/core.umd.js',
'node_modules/rxjs/Subject.js',
'node_modules/rxjs/Observable.js',
...
];

但我认为这不是一个好的解决方案。

所以问题是，如何从 rxjs 库中捆绑所有需要的文件？（Angular2 需要）

Answer 1

我以以下解决方案结束。

var builder = new SystemJSBuilder('./', {
      map: {
        'rxjs': 'node_modules/rxjs'
      },
      packages: {
        "rxjs": {main: "Rx.js", defaultExtension: "js"}
      }
    });
    return builder.bundle('rxjs', '.tmp/rxjs.js');

所以我为 angular2 和 rxjs 创建了单独的包，然后将它们连接到一个库中。

systemjs-builder - 为 angular2 捆绑 rxjs

systemjs-builder - bundling rxjs for angular2

rxjs

systemjs

angular