Why SystemJS?

[johnjelinek]

With TypeScript compilation, should it be necessary to still use jspm/traceur/systemjs?

[rkirov]

For simplicity, it allows 1:1 mapping between the files you write and what you load in the browser. Otherwise, I have to bring in a bundling tool into this picture - browserify, webpack or systemjs-buildtool.

[johnjelinek]

There seems to be good success using gulp-typescript over in this repo: https://github.com/mgechev/angular2-seed. Turns out SystemJS + ES6 Module Loader is still required, but no Traceur/Babel needed.

[PatrickJS]

@johnjelinek the next few versions of systemjs will support typescript natively. Traceur will be removed soon once Angular2 is fully off of typescript. If you're looking for an example without systemjs then you can check out this one angular-class/angular2-webpack-starter. Once TypeScript is able to compile to systemjs and systemjs can also read typescript then the build story will be a lot better (when typescript and systemjs are both out of beta)

[rkirov]

To clarify our quick started guide at angular.io - https://angular.io/docs/js/latest/quickstart.html does not need babel/traceur, by virtue of using the angular2.dev.js bundle.

All that is needed is something to transpile your .ts files locally and system.js at runtime to glue your app and the angular 2 bundle.

[johnjelinek]

@gdi2290: I installed the latest tsc from master yesterday and found it supports --module system and --module umd.

[johnjelinek]

You also will need SystemJS to do ES6 module imports, methinks (regardless of traceur/babel).

[johnjelinek]

oh -- scratch that, you can use ES6 module imports without SystemJS if you use relative paths (as seen in angular2-webpack-starter.

[rkirov]

@johnjelinek No matter how you declare and what language the modules are written in, they have to be put together. Here are the options:

• (static) bundle the modules by a server-side tool - webpack, browserify.
• (dynamic) provide a browser shim for requiring modules (that XHRs and evals) - System.js

[PatrickJS]

@johnjelinek I decided not to include systemjs for practical reasons but it's not to say you shouldn't get systemjs a try. Systemjs is the future but it's missing a lot of production ready stuff. Webpack (you can also provide dynamic loading) is great but the api is showing age of it's generation so you can think of it like this (made of on the fly only for demonstration purposes)

// scripttags: generation1
// requirejs: generation1++
// browserify: generation2
webpack: generation2++ (built with commonjs in mind)
systemjs: generation3- (built with es6 in mind)

now you can see why they're kinda on the same playing field with each one having their pros and cons. Also keep in mind Angular's goal is allowing you to use the future today which means some stuff aren't quite there yet but it will be. Also keep in mind these decisions for the build system are moot since they're depended on the developer and their workflow. The purpose on this repo is to show how easy it is to get started with angular leaving everything else up to you afterwards