chore(deps): migrate from angular2 beta.15 to RC1

src/WebPackAngular2TypeScript/client/app/app.component.ts

@@ -1,5 +1,5 @@
-import { Component } from 'angular2/core';
-import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from 'angular2/router';
+import { Component } from '@angular/core';
+import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '@angular/router-deprecated';
 import { HeroesComponent } from '../heroes/heroes.component';
 import { HeroDetailComponent } from '../heroes/hero-detail.component';
 import { HeroService } from '../heroes/hero.service';
@@ -22,7 +22,7 @@ import { DashboardComponent } from '../dashboard/dashboard.component';
   providers: [
     ROUTER_PROVIDERS,
     HeroService,
-  ], 
+  ],
 })
 @RouteConfig([{
     path: '/dashboard',
@@ -39,7 +39,7 @@ import { DashboardComponent } from '../dashboard/dashboard.component';
     component: HeroDetailComponent,
   }])
 export class AppComponent {
-  
+
   title = 'Tour of Heroes';
-  
+
 }

src/WebPackAngular2TypeScript/client/dashboard/dashboard.component.html

@@ -1,6 +1,6 @@
 <h3>Top Heroes</h3>
 <div class="grid grid-pad">
-    <div *ngFor="#hero of heroes" (click)="gotoDetail(hero)" class="col-1-4" >
+    <div *ngFor="let hero of heroes" (click)="gotoDetail(hero)" class="col-1-4" >
         <div class="module hero">
             <h4>{{hero.name}}</h4>
         </div>

src/WebPackAngular2TypeScript/client/dashboard/dashboard.component.spec.ts

@@ -1,8 +1,9 @@
-import { beforeEachProviders, describe, expect, inject, it, xit } from 'angular2/testing';
-import { provide } from 'angular2/core';
-import { Location, Router, RouteRegistry, ROUTER_PRIMARY_COMPONENT } from 'angular2/router';
-import { RootRouter } from 'angular2/src/router/router';
-import { SpyLocation } from 'angular2/src/mock/location_mock';
+import { beforeEachProviders, describe, expect, inject, it, xit } from '@angular/core/testing';
+import { provide } from '@angular/core';
+import { Location } from '@angular/common';
+import { Router, RouteRegistry, ROUTER_PRIMARY_COMPONENT } from '@angular/router-deprecated';
+import { RootRouter } from '@angular/router-deprecated/src/router';
+import { SpyLocation } from '@angular/common/testing';
 
 import { DashboardComponent } from './dashboard.component';
 import { HeroService } from '../heroes/hero.service';
@@ -15,7 +16,7 @@ describe('DashboardComponent', () => {
   function mockServiceFactory() : HeroService {
     heroService = jasmine.createSpyObj<HeroService>('HeroService', [
        'getHeroes', 'getHeroesSlowly', 'getHero']);
-    
+
     return <HeroService>heroService;
   }
 
@@ -27,12 +28,12 @@ describe('DashboardComponent', () => {
     provide(ROUTER_PRIMARY_COMPONENT, {useValue: DashboardComponent}),
     provide(Router, {useClass: RootRouter})
   ]);
-  
+
   it('true is true', () => expect(true).toBe(true));
 
   it('should have empty heroes', inject([ DashboardComponent ], (dashboard: DashboardComponent) => {
     expect(dashboard.heroes).toEqual([]);
   }));
-  
+
 });
 

src/WebPackAngular2TypeScript/client/dashboard/dashboard.component.ts

@@ -1,5 +1,5 @@
-import { Component, OnInit } from 'angular2/core';
-import { Router } from 'angular2/router';
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router-deprecated';
 import { Hero } from '../heroes/hero';
 import { HeroService } from '../heroes/hero.service';
 
@@ -9,22 +9,22 @@ import { HeroService } from '../heroes/hero.service';
   styles: [require('./dashboard.component.css')],
 })
 export class DashboardComponent implements OnInit {
-  
+
   constructor(
     private _router: Router,
     private _heroService: HeroService) {
   }
 
   heroes: Hero[] = [];
-  
+
   ngOnInit() {
     this._heroService.getHeroes()
       .then(heroes => this.heroes = heroes.slice(1, 5));
   }
-  
+
   gotoDetail(hero: Hero) {
     let link = ['HeroDetail', { id: hero.id }];
     this._router.navigate(link);
   }
-  
+
 }

src/WebPackAngular2TypeScript/client/heroes/hero-detail.component.ts

@@ -1,5 +1,5 @@
-import { Component, OnInit, Input } from 'angular2/core';
-import { RouteParams } from 'angular2/router';
+import { Component, OnInit, Input } from '@angular/core';
+import { RouteParams } from '@angular/router-deprecated';
 import { HeroService } from './hero.service';
 import { Hero } from './hero';
 
@@ -9,23 +9,23 @@ import { Hero } from './hero';
   styles: [require('./hero-detail.component.css')],
 })
 export class HeroDetailComponent implements OnInit {
-  
+
   constructor(
     private _heroService: HeroService,
     private _routeParams: RouteParams) {
   }
-  
+
   @Input() hero: Hero;
-  
+
   ngOnInit() {
     let id = +this._routeParams.get('id');
-    
+
     this._heroService.getHero(id)
       .then(hero => this.hero = hero);
   }
 
   goBack() {
     window.history.back();
   }
-  
+
 }

src/WebPackAngular2TypeScript/client/heroes/hero.service.ts

@@ -1,14 +1,14 @@
-import { Injectable } from 'angular2/core';
+import { Injectable } from '@angular/core';
 import { Hero } from './hero';
 import { HEROES } from './mock-heroes';
 
 @Injectable()
 export class HeroService {
-  
+
   getHeroes() : Promise<Hero[]> {
     return Promise.resolve(HEROES);
   }
-  
+
   getHeroesSlowly() : Promise<Hero[]> {
     return new Promise<Hero[]>(resolve =>
       setTimeout(() => resolve(HEROES), 2000) // 2 seconds
@@ -20,5 +20,5 @@ export class HeroService {
       heroes => heroes.filter(hero => hero.id === id)[0]
     );
   }
-    
+
 }

src/WebPackAngular2TypeScript/client/heroes/heroes.component.html

@@ -1,7 +1,7 @@
 <h2>My Heroes</h2>
 <ul class="heroes">
-  <li *ngFor="#hero of heroes"
-    [class.selected]="hero === selectedHero" 
+  <li *ngFor="let hero of heroes"
+    [class.selected]="hero === selectedHero"
     (click)="onSelect(hero)">
     <span class="badge">{{hero.id}}</span> {{hero.name}}
   </li>

src/WebPackAngular2TypeScript/client/heroes/heroes.component.ts

@@ -1,5 +1,5 @@
-import { Component, OnInit } from 'angular2/core';
-import { Router } from 'angular2/router';
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router-deprecated';
 import { Hero } from './hero';
 import { HeroService } from './hero.service';
 import { HeroDetailComponent } from './hero-detail.component';
@@ -11,28 +11,28 @@ import { HeroDetailComponent } from './hero-detail.component';
     directives: [HeroDetailComponent],
 })
 export class HeroesComponent implements OnInit {
-  
+
   constructor(
     private _router: Router,
     private _heroService: HeroService) { }
-    
+
   heroes: Hero[];
-  
+
   selectedHero: Hero;
 
   ngOnInit() {
     this.getHeroes();
   }
-  
+
   onSelect(hero: Hero) { this.selectedHero = hero; }
-  
+
   getHeroes() {
     this._heroService.getHeroes().then(heroes => this.heroes = heroes);
     //this._heroService.getHeroesSlowly().then(heroes => this.heroes = heroes);
   }
-  
+
   gotoDetail() {
     this._router.navigate(['HeroDetail', { id: this.selectedHero.id }]);
   }
-    
+
 }

src/WebPackAngular2TypeScript/client/karma-entry.js

@@ -1,27 +1,37 @@
 /*
- * This is the entry file for karma tests, running some test environment setup code 
+ * This is the entry file for karma tests, running some test environment setup code
  * needed across all tests running in the browser, and then requiring all spec files.
  */
 
 // Turn on full stack traces in errors to help debugging
 Error.stackTraceLimit = Infinity;
 
+require('core-js');
+
+require('zone.js/dist/zone');
+require('zone.js/dist/long-stack-trace-zone');
+require('zone.js/dist/jasmine-patch');
+require('zone.js/dist/async-test');
+require('zone.js/dist/fake-async-test');
+require('zone.js/dist/sync-test');
+
 // Somewhere in the test setup, select BrowserDomAdapter to run tests in the browser
 // see https://github.com/AngularClass/angular2-webpack-starter/issues/124
-var testing = require('angular2/testing');
-var browser = require('angular2/platform/testing/browser');
+var testing = require('@angular/core/testing');
+var browser = require('@angular/platform-browser-dynamic/testing');
 
 testing.setBaseTestProviders(
-  browser.TEST_BROWSER_PLATFORM_PROVIDERS,
-  browser.TEST_BROWSER_APPLICATION_PROVIDERS);
+  browser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
+  browser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS
+);
 
 // Find all tests and run them
 /*
  * Create a webpack context using the 'context()' method provided by webpack itself.
- * Match all spec files to be run, by looking for the specified pattern, starting 
+ * Match all spec files to be run, by looking for the specified pattern, starting
  * from current directory and then recursively (with the 'true' flag).
  * Webpack context is both a function and an object. As an object, its keys are the
- * matched filenames. As a function, it 'require's the filename passed as input, so  
+ * matched filenames. As a function, it 'require's the filename passed as input, so
  * it actually executes that.
  */
 var context = require.context('./', true, /\.spec\.ts/);

src/WebPackAngular2TypeScript/client/main.ts

@@ -1,5 +1,5 @@
-import { enableProdMode } from 'angular2/core';
-import { bootstrap } from 'angular2/platform/browser';
+import { enableProdMode } from '@angular/core';
+import { bootstrap } from '@angular/platform-browser-dynamic';
 import { AppComponent } from './app/app.component';
 
 if (NODE_ENV === 'production') {

src/WebPackAngular2TypeScript/client/vendor.ts

@@ -1,21 +1,24 @@
 // Angular 2 polyfills
 
-//import 'angular2/bundles/angular2-polyfills';
-// (following modules are what are in 'angular2/bundles/angular2-polyfills' so this is not needed)
-
 //import 'ie-shim';  // Internet Explorer
-import 'es6-shim';
+import 'core-js/es6';
 
 // Angular 2 libs
 import 'reflect-metadata';
 import 'zone.js/dist/zone.min';
 
 // Angular 2
 // import Angular 2 here, so to have it as common dependencies in vendor bundle
-import 'angular2/platform/browser';
-import 'angular2/core';
-import 'angular2/http';
-import 'angular2/router';
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router-deprecated';
+
+// RxJS
+// avoid importing the whole RxJS library here. Although more tedious, look for all
+// "import 'rxjs/xxx';" occurences in your source code, and collect them here as well
 
 if (NODE_ENV === 'development') {
   // activate long strack traces, only in development

src/WebPackAngular2TypeScript/karma.conf.js

@@ -9,6 +9,8 @@ if (! ['run-once', 'debug', 'watch'].includes(testMode))
   testMode = 'run-once';
 }
 
+process.env.PHANTOMJS_BIN = 'node_modules/phantomjs-prebuilt/lib/phantom/bin/phantomjs.exe';
+
 /*
  * When testing with webpack and transpiled JS, we have to do some extra
  * things to get testing to work right. Because we can only include JS
@@ -36,15 +38,6 @@ module.exports = function(config) {
     // list of files/patterns to load in the browser, serve or watch. Order is important.
     // with webpack plugin enabled, each file acts as entry point for webpack configuration
     files: [
-      // required third-party modules
-      { pattern: 'node_modules/es6-shim/es6-shim.js', included: true, watched: false },
-      { pattern: 'node_modules/es6-promise/dist/es6-promise.js', included: true, watched: false },
-      { pattern: 'node_modules/reflect-metadata/Reflect.js', included: true, watched: false },
-      { pattern: 'node_modules/reflect-metadata/Reflect.js.map', included: false, watched: false },
-      { pattern: 'node_modules/zone.js/dist/zone-microtask.js', included: true, watched: false },
-      { pattern: 'node_modules/zone.js/dist/long-stack-trace-zone.js', included: true, watched: false },
-      { pattern: 'node_modules/rxjs/**', included: false, watched: false },
-      { pattern: 'node_modules/angular2/**/*.js', included: false, watched: false },
       // shim entry point, to build test environment and run all spec files
       { pattern: common.paths.testEntry, included: true, watched: false },
       // the actual test spec, only to be monitored for re-runs

src/WebPackAngular2TypeScript/package.json

@@ -53,12 +53,18 @@
     "npm": ">= 3"
   },
   "dependencies": {
-    "angular2": "2.0.0-beta.15",
-    "es6-promise": "3.1.2",
-    "es6-shim": "^0.35.0",
-    "reflect-metadata": "0.1.2",
-    "rxjs": "5.0.0-beta.2",
-    "zone.js": "0.6.11"
+    "@angular/common": "2.0.0-rc.1",
+    "@angular/compiler": "2.0.0-rc.1",
+    "@angular/core": "2.0.0-rc.1",
+    "@angular/http": "2.0.0-rc.1",
+    "@angular/platform-browser": "2.0.0-rc.1",
+    "@angular/platform-browser-dynamic": "2.0.0-rc.1",
+    "@angular/router": "2.0.0-rc.1",
+    "@angular/router-deprecated": "2.0.0-rc.1",
+    "core-js": "^2.4.0",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "^5.0.0-beta.8",
+    "zone.js": "^0.6.12"
   },
   "devDependencies": {
     "autoprefixer": "^6.3.6",
@@ -75,7 +81,7 @@
     "karma-phantomjs-launcher": "^1.0.0",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^1.7.0",
-    "phantomjs-prebuilt": "^2.1.6",
+    "phantomjs-prebuilt": "^2.1.7",
     "postcss-loader": "^0.9.1",
     "style-loader": "^0.13.1",
     "raw-loader": "^0.5.1",
@@ -84,7 +90,7 @@
     "tslint": "^3.3.0",
     "tslint-loader": "^2.1.0",
     "typescript": "^1.8.10",
-    "typings": "^0.7.12",
+    "typings": "^1.0.4",
     "webpack": "^1.12.14",
     "webpack-dev-server": "^1.14.1"
   }

src/WebPackAngular2TypeScript/tsconfig.json

@@ -13,8 +13,7 @@
   "exclude": [
     "buildOutput",
     "node_modules",
-    "typings/main",
-    "typings/main.d.ts"
+    "typings/index.d.ts"
   ],
   "compileOnSave": false,
   "buildOnSave": false