feat: serve and bundle using webpack2.

package.json

@@ -3,9 +3,9 @@
   "version": "1.0.0",
   "description": "A simple starter Angular2 project",
   "scripts": {
-    "build": "webpack --inline --colors --progress --display-error-details --display-cached",
+    "build": "webpack --inline --colors --progress --display-cached",
     "watch": "npm run build -- --watch",
-    "server": "webpack-dev-server --inline --colors --progress --display-error-details --display-cached --port 3000  --content-base src",
+    "server": "webpack-dev-server --inline --progress --port 3000  --content-base src",
     "start": "npm run server"
   },
   "contributors": [
@@ -14,6 +14,7 @@
   ],
   "license": "MIT",
   "devDependencies": {
+    "@angular/compiler-cli": "^0.6.2",
     "@types/core-js": "^0.9.32",
     "@types/node": "^6.0.38",
     "angular2-template-loader": "^0.4.0",
@@ -22,21 +23,21 @@
     "raw-loader": "^0.5.1",
     "to-string-loader": "^1.1.4",
     "typescript": "^2.0.2",
-    "webpack": "^1.12.9",
-    "webpack-dev-server": "^1.14.0",
-    "webpack-merge": "^0.8.4"
+    "webpack": "^2.1.0-beta",
+    "webpack-dev-server": "^2.1.0-beta",
+    "webpack-merge": "^0.14.1"
   },
   "dependencies": {
-    "@angular/common": "2.0.0",
-    "@angular/compiler": "2.0.0",
-    "@angular/core": "2.0.0",
-    "@angular/forms": "2.0.0",
-    "@angular/http": "2.0.0",
-    "@angular/platform-browser": "2.0.0",
-    "@angular/platform-browser-dynamic": "2.0.0",
-    "@angular/platform-server": "2.0.0",
-    "@angular/router": "3.0.0",
-    "@angular/upgrade": "2.0.0",
+    "@angular/common": "^2.0.0",
+    "@angular/compiler": "^2.0.0",
+    "@angular/core": "^2.0.0",
+    "@angular/forms": "^2.0.0",
+    "@angular/http": "^2.0.0",
+    "@angular/platform-browser": "^2.0.0",
+    "@angular/platform-browser-dynamic": "^2.0.0",
+    "@angular/platform-server": "^2.0.0",
+    "@angular/router": "^3.0.0",
+    "@angular/upgrade": "^2.0.0",
     "core-js": "^2.4.1",
     "ie-shim": "^0.1.0",
     "reflect-metadata": "^0.1.3",

src/app/github/shared/github.ts

@@ -1,29 +1,23 @@
-import { Injectable } from '@angular/core';
-import { Http, URLSearchParams } from '@angular/http';
 import 'rxjs/add/operator/map';
 
+import {Injectable} from '@angular/core';
+import {Http, URLSearchParams} from '@angular/http';
+
 @Injectable()
 export class Github {
   constructor(private http: Http) {}
 
-  getOrg(org: string) {
-    return this.makeRequest(`orgs/${org}`);
-  }
+  getOrg(org: string): any { return this.makeRequest(`orgs/${org}`); }
 
-  getReposForOrg(org: string) {
-    return this.makeRequest(`orgs/${org}/repos`);
-  }
+  getReposForOrg(org: string): any { return this.makeRequest(`orgs/${org}/repos`); }
 
-  getRepoForOrg(org: string, repo: string) {
-    return this.makeRequest(`repos/${org}/${repo}`);
-  }
+  getRepoForOrg(org: string, repo: string): any { return this.makeRequest(`repos/${org}/${repo}`); }
 
-  private makeRequest(path: string) {
+  private makeRequest(path: string): any {
     let params = new URLSearchParams();
     params.set('per_page', '100');
 
-    let url = `https://api.github.com/${ path }`;
-    return this.http.get(url, {search: params})
-      .map((res) => res.json());
+    let url = `https://api.github.com/${path}`;
+    return this.http.get(url, {search: params}).map((res) => res.json());
   }
 }

src/index.html

@@ -12,8 +12,6 @@
       Loading...
     </app>
 
-    <script src="/polyfills.bundle.js"></script>
-    <script src="/vendor.bundle.js"></script>
     <script src="/main.bundle.js"></script>
 
   </body>

src/main.browser.ts

@@ -1,5 +1,8 @@
-import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
-import {AppModule} from './app/app.module';
+import 'reflect-metadata';
+import 'zone.js';
 
-platformBrowserDynamic().bootstrapModule(AppModule)
-  .catch(err => console.error(err));
+import {platformBrowser} from '@angular/platform-browser';
+
+import {AppModuleNgFactory} from './app/app.module.ngfactory';
+
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory).catch(err => console.error(err));

tsconfig.json

@@ -2,8 +2,9 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "es5",
-    "outDir": "dist",
-    "rootDir": ".",
+    "outDir": "build",
+    "declaration": true,
+    "rootDir": "src",
     "sourceMap": true,
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
@@ -16,6 +17,10 @@
   "exclude": [
     "node_modules"
   ],
+  "angularCompilerOptions": {
+    "strictMetadataEmit": true,
+    "trace": true
+  },
   "awesomeTypescriptLoaderOptions": {
     "useWebpackText": true
   },

webpack.config.js

@@ -5,18 +5,30 @@ var path = require('path');
 // Webpack Config
 var webpackConfig = {
   entry: {
-    'polyfills': './src/polyfills.browser.ts',
-    'vendor':    './src/vendor.browser.ts',
-    'main':       './src/main.browser.ts',
+    'main': 'main.browser',
   },
 
   output: {
-    path: './dist',
+    path: path.resolve('./dist'),
   },
 
   plugins: [
-    new webpack.optimize.OccurenceOrderPlugin(true),
-    new webpack.optimize.CommonsChunkPlugin({ name: ['main', 'vendor', 'polyfills'], minChunks: Infinity }),
+    // new webpack.optimize.OccurenceOrderPlugin(true),
+    // new webpack.optimize.CommonsChunkPlugin({ name: ['main'], minChunks: Infinity }),
+    // new webpack.optimize.UglifyJsPlugin(),
+    new webpack.LoaderOptionsPlugin({
+      minimize: true,
+      debug: false
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: false
+      },
+      output: {
+        comments: false
+      },
+      sourceMap: true
+    }),
   ],
 
   module: {
@@ -30,36 +42,32 @@ var webpackConfig = {
 
 };
 
-
 // Our Webpack Defaults
 var defaultConfig = {
-  devtool: 'cheap-module-source-map',
+  // devtool: 'cheap-module-source-map',
+  devtool: 'source-map',
   cache: true,
-  debug: true,
+  // debug: true,
   output: {
     filename: '[name].bundle.js',
     sourceMapFilename: '[name].map',
     chunkFilename: '[id].chunk.js'
   },
 
   resolve: {
-    root: [ path.join(__dirname, 'src') ],
-    extensions: ['', '.ts', '.js']
+    modules: [
+      path.resolve('./build'),
+      path.resolve('./src'),
+      path.resolve('./node_modules')
+    ],
+    // root: [  ],
+    extensions: ['.ts', '.js']
   },
 
   devServer: {
     historyApiFallback: true,
     watchOptions: { aggregateTimeout: 300, poll: 1000 }
   },
-
-  node: {
-    global: 1,
-    crypto: 'empty',
-    module: 0,
-    Buffer: 0,
-    clearImmediate: 0,
-    setImmediate: 0
-  }
 };
 
 var webpackMerge = require('webpack-merge');