Update to new module system

DanWahlin · Apr 29, 2016 · 7af6645 · 7af6645
1 parent 8aa106a
commit 7af6645
Show file tree

Hide file tree

Showing 12 changed files with 116 additions and 49 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,7 +1,7 @@
 node_modules
+npm-debug.log
 app/**/*.js
 app/**/*.js.map
-npm-debug.log
 
 
 
diff --git a/app/app.component.ts b/app/app.component.ts
@@ -1,5 +1,5 @@
-import { Component } from 'angular2/core';
-import { ROUTER_DIRECTIVES, RouteConfig } from 'angular2/router';
+import { Component } from '@angular/core';
+import { ROUTER_DIRECTIVES, RouteConfig } from '@angular/router';
 
 import { APP_PROVIDERS } from './app.providers';
 import { CustomersComponent } from './customers/customers.component';

diff --git a/app/app.providers.ts b/app/app.providers.ts
@@ -1,6 +1,7 @@
-import { bind } from 'angular2/core';
-import { ROUTER_PROVIDERS, LocationStrategy, HashLocationStrategy } from 'angular2/router';
-import { HTTP_PROVIDERS } from 'angular2/http';
+import { bind } from '@angular/core';
+import { LocationStrategy, HashLocationStrategy } from '@angular/common';
+import { ROUTER_PROVIDERS } from '@angular/router';
+import { HTTP_PROVIDERS } from '@angular/http';
 
 import { DataService } from './shared/services/data.service';
 
@@ -9,5 +10,5 @@ export const APP_PROVIDERS = [
     DataService,
     HTTP_PROVIDERS,
     ROUTER_PROVIDERS,
-    bind(LocationStrategy).toClass(HashLocationStrategy)
+    //bind(LocationStrategy).toClass(HashLocationStrategy)
 ];
diff --git a/app/customers/customers.component.ts b/app/customers/customers.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from 'angular2/core';
+import { Component, OnInit } from '@angular/core';
 import { Observable } from 'rxjs/Rx';
 
 import { DataService } from '../shared/services/data.service';

diff --git a/app/main.ts b/app/main.ts
@@ -1,4 +1,4 @@
-import { bootstrap } from 'angular2/platform/browser';
+import { bootstrap } from '@angular/platform-browser-dynamic';
 
 import { AppComponent } from './app.component';
 

diff --git a/app/shared/services/data.service.ts b/app/shared/services/data.service.ts
@@ -1,5 +1,5 @@
-import { Injectable } from 'angular2/core';
-import { Http, Response, Headers, RequestOptions } from 'angular2/http';
+import { Injectable } from '@angular/core';
+import { Http, Response, Headers, RequestOptions } from '@angular/http';
 
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/catch';

diff --git a/bundle.js b/bundle.js
@@ -0,0 +1,16 @@
+var SystemBuilder = require('systemjs-builder');
+var argv = require('yargs').argv;
+var builder = new SystemBuilder();
+
+builder.loadConfig('./src/system.config.js')
+  .then(function(){
+	  var outputFile = argv.prod ? 'dist/bundle.min.js' : 'dist/bundle.js';
+	  return builder.buildStatic('app', outputFile, {
+		  minify: argv.prod,
+		  mangle: argv.prod,
+		  rollup: argv.prod
+	  });
+  })
+  .then(function(){
+	  console.log('bundle built successfully!');
+  });
diff --git a/config/config.development.json b/config/config.development.json
@@ -1,6 +1,6 @@
 {
     "databaseConfig": {
-        "host": "mongodb",
+        "host": "localhost",
         "database": "customermanager"
     }
 }
diff --git a/index.html b/index.html
@@ -10,6 +10,20 @@
     <link href='//fonts.googleapis.com/css?family=Open+Sans:300,400,600' rel='stylesheet' type='text/css' />
     <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
     <link href="styles/styles.css" rel="stylesheet" />
+
+	<script src="node_modules/zone.js/dist/zone.js"></script>
+	<script src="node_modules/reflect-metadata/Reflect.js"></script>
+	<script src="node_modules/systemjs/dist/system.js"></script>
+
+	<!-- remove for bundle usage -->
+	<script src="system.config.js"></script>
+	<script>
+		System.import('app').catch(function(err){
+			console.error(err);
+		});
+	</script>
+	<!-- remove for bundle usage -->
+
 </head>
 <body>
     <header class="navbar navbar-inner navbar-fixed-top">
@@ -50,29 +64,9 @@
         </div>
     </footer>
 
-   <!-- Required polyfills (order matters) -->
-   <script src="/node_modules/es6-shim/es6-shim.min.js"></script>
-   <script src="/node_modules/systemjs/dist/system-polyfills.js"></script>
-   <script src="/node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
-
-   <script src="/node_modules/angular2/bundles/angular2-polyfills.js"></script>
-   <script src="/node_modules/systemjs/dist/system.src.js"></script>
-   <script src="/node_modules/rxjs/bundles/Rx.js"></script>
-   <script src="/node_modules/angular2/bundles/angular2.dev.js"></script>
-   <script src="/node_modules/angular2/bundles/http.dev.js"></script>
-   <script src="/node_modules/angular2/bundles/router.dev.js"></script>
-
-  <script>
-    System.config({
-        packages: {
-          app: {
-            format: 'register',
-            defaultExtension: 'js'
-          }
-        }
-      });
-    System.import('app/main')
-          .then(null, console.error.bind(console));
-  </script>
+	<!-- add for bundle usage -->
+	<!-- <script src="dist/bundle.min.js"></script> -->
+	<!-- add for bundle usage -->
+
 </body>
 </html>
diff --git a/package.json b/package.json
@@ -4,19 +4,25 @@
   "version": "1.0.0",
   "scripts": {
     "postinstall": "npm run typings install",
-    "tsc": "tsc",
-    "tsc:w": "tsc --watch",
-    "live": "live-server --open=src",
+    "build": "tsc",
+    "build:w": "tsc --watch",
+    "bundle": "node bundle.js",
+    "bundle:prod": "node bundle.js --prod",
     "server": "node server.js",
-    "start": "concurrently \"npm run tsc:w\" \"supervisor -i app server.js\"",
+    "start": "concurrently \"npm run build:w\" \"supervisor -i app server.js\"",
     "typings": "typings"
   },
   "dependencies": {
-    "angular2": "2.0.0-beta.16",
-    "systemjs": "0.19.26",
-    "es6-shim": "^0.35.0",
-    "reflect-metadata": "0.1.2",
+    "@angular/common": "0.0.0-0",
+    "@angular/compiler": "0.0.0-0",
+    "@angular/core": "0.0.0-0",
+    "@angular/platform-browser": "0.0.0-0",
+    "@angular/platform-browser-dynamic": "0.0.0-0",
+    "@angular/http": "0.0.0-0",
+    "@angular/router": "0.0.0-0",
+    "reflect-metadata": "0.1.3",
     "rxjs": "5.0.0-beta.2",
+    "systemjs": "0.19.26",
     "zone.js": "0.6.12",
     "express": "4.13.4",
     "jade": ">=1.11.0",
@@ -30,8 +36,10 @@
   },
   "devDependencies": {
     "concurrently": "^2.0.0",
-    "live-server": "^0.9.2",
-    "typescript": "^1.8.9",
-    "typings":"^0.7.11"
+    "live-server": "^1.0.0",
+    "typescript": "^1.8.10",
+    "typings":"^0.8.1",
+    "systemjs-builder": "^0.15.15",
+    "yargs": "^4.6.0"
   }
 }
diff --git a/system.config.js b/system.config.js
@@ -0,0 +1,45 @@
+//configure system loader
+System.config({
+	map: {
+		'rxjs': 'node_modules/rxjs',
+		'@angular': 'node_modules/@angular',
+		'app': 'app' //'dist'
+	},
+	packages: {
+		'app': {
+			main: 'main.js',
+			defaultExtension: 'js'
+		},
+		'@angular/core': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'@angular/compiler': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'@angular/common': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'@angular/platform-browser': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'@angular/platform-browser-dynamic': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'@angular/http': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'@angular/router': {
+			main: 'index.js',
+			defaultExtension: 'js'
+		},
+		'rxjs': {
+			defaultExtension: 'js'
+		}
+	}
+});
diff --git a/typings.json b/typings.json
@@ -1,5 +1,8 @@
 {
+  "name": "system-js",
+  "version": false,
+  "dependencies": {},
   "ambientDependencies": {
-    "es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#7de6c3dd94feaeb21f20054b9f30d5dabc5efabd"
+    "es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654"
   }
-}
+}