Question

我有一个Angular2应用程序，在开发环境中它运行正常。所有Angular2依赖项都在运行时从node_modules dir。

加载

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

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

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库都包含在输出文件中。但是当我运行app时，我获得了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

1 个答案: