systemjs-builder - bundling rxjs for angular2

700 views Asked by At

I have an Angular2 app, and on dev environment it works fine. All Angular2 dependencies are loaded in runtime from node_modules dir.

I use gulp-typescript plugin for bundling application code, and system-js for bundling third party libraries code.

This is gulp task for bundling lib files:

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');
}

I would like all rxjs libraries to be included in output file. But when I run app, I get 404 status for

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

(and all other rxjs files).

It helps to bundle each separate rxjs file:

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

But I believe that it is not good solution.

So the question is, how can I bundle all needed files from rxjs library? (needed for Angular2)

1

There are 1 answers

0
gka On BEST ANSWER

I ended with following solution.

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

So I create separate bundles for angular2 and rxjs, and then concat them to one library.