Will I be able to use Typescript with angular 2.0, or should I use Traceur?

As I asked in this post I was wanting to know how compatible Typescript is with ES6, which Typescript 2.0 plans to support:

Should I use Traceur instead of Typescript to target ES5 but be ready for ES6

However as I read this post by google it appears that Traceur is used pretty heavily in the upcoming Angular 2.0.

So I’m trying to decide on whether to go with typescript or Traceur to be better ready for Angular 2.0 (my team will have less refactoring).

How to set up script tags for angularjs 2 written in Es6 for transpilation to Es5

Below is from a plunker that started from the angularjs 2 es6 template http://goo.gl/IGaTZw
I added traceur and removed the main.es6.js replacing with main.js in case the implicit mode was interfering.

<script data-require="traceur-runtime@0.0.88" data-semver="0.0.88" src="https://cdn.rawgit.com/google/traceur-compiler/d3d0553de3315398a956dc2f9edd6a982d786b0a/bin/traceur-runtime.js"></script>
<script src="https://jspm.io/system.js"></script>
<script src="https://code.angularjs.org/2.0.0-alpha.30/angular2.dev.js"></script>



import {
  ComponentAnnotation as Component,
  ViewAnnotation as View, bootstrap
} from 'angular2/angular2';

  selector: 'app',
  viewInjector: [Service]
  template: '{{greeting}} world!'
class App {
  constructor(service: Service) {
    this.greeting = service.greeting();
    setTimeout(() => this.greeting = 'Howdy,', 1000);


class Service {
  greeting() {
    return 'Hello';


I tried to do locally having downloaded script files but failed there as well. I cannot use npm etc as have an issue with my laptop.

Many thanks in advance.

Upgrading to Angular 2 final version : traceur.js error

I am facing an issue after upgrading from Angular 2 RC5 to Angular 2 final version (2.1.1). I am using system.js.
My all typescript code was working fine before upgrading and I did not update any of it.

Here is the error I keep getting :

Error: SyntaxError: Unexpected token <
        at eval (<anonymous>)
    Evaluating http://localhost:8888/traceur.js
        Error loading http://localhost:8888/traceur.js
        Error loading http://localhost:8888/node_modules/@angular/router/index.js as "@angular/router" from http://localhost:8888/js/typescript/app.module.jsZoneDelegate.invoke

I copied the package.json from Angular 2 docs (https://angular.io/docs/ts/latest/guide/npm-packages.html)

And here is my app.module.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing } from './app.routes';
import { SharedModule } from './shared/shared.module';
import { RouterModule } from '@angular/router';

    imports:      [ BrowserModule,
                    routing ],
    bootstrap:    [ AppComponent ],

export class AppModule {}

EDIT : Here is my sytemjs.config.js file:

  var map = {
    'app':                        'app', // 'dist',

    'angular2':                   'node_modules/angular2',
    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs',
    'zone.js':                    'node_modules/zone.js',
    'ng2-bootstrap':              'node_modules/ng2-bootstrap',
    'moment':                     'node_modules/moment',
    'express':                    'node_modules/express'

  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
    'zone.js':                    { main: 'dist/index.js', defaultExtension: 'js' },
    'ng2-bootstrap':              { main: 'ng2-bootstrap.js', defaultExtension: 'js' },
    'moment':                     { main: 'moment.js', defaultExtension: 'js' },
    'notifications':              { main: 'components.js', defaultExtension: 'js' },
    'angular2-recaptcha':         { defaultExtension: 'js', main:'index' },
    'rxjs' :                      {main: 'Rx'},
    '@angular/core' :             {main: 'bundles/core.umd.js'},
    '@angular/common' :           {main: 'bundles/common.umd.js'},
    '@angular/upgrade' :          {main: 'bundles/upgrade.umd.js'},
    '@angular/compiler' :         {main: 'bundles/compiler.umd.js'},
    '@angular/forms' :            {main: 'bundles/forms.umd.js'},
    '@angular/router' :           {main: 'bundles/router.umd.js'},
    '@angular/platform-browser' : {main: 'bundles/platform-browser.umd.js'},
    '@angular/platform-browser-dynamic': {main: 'bundles/platform-browser-dynamic.umd.js'},
    '@angular/http' :             {main: 'bundles/http.umd.min.js'}

and my app.routes.ts file:

import { Routes, RouterModule } from '@angular/router';

// Components
import { HomeComponent } from './shared/components/home.component';
import { ClubComponent } from './shared/components/club.component';
import { BusinessPageComponent } from './shared/components/business-page.component';

const appRoutes: Routes = [
    // Child routing
        path: 'profil',
        loadChildren: '/js/typescript/profile/profile.module#ProfileModule'

        path: 'recherche',
        loadChildren: '/js/typescript/job-search/job-search.module#JobSearchModule'

    // Business page
    { path: 'etablissement/:businessId', component: BusinessPageComponent },
    { path: 'club/:clubId', component: BusinessPageComponent },

    // Root
    { path: '', redirectTo: '/accueil', pathMatch: 'full'},

// - Updated Export
export const routing = RouterModule.forRoot(appRoutes, { useHash: true });