diff --git a/.editorconfig b/.editorconfig
index 87a8c212..a443ba78 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -8,6 +8,5 @@ root = true
 charset = utf-8
 indent_style = space
 indent_size = 2
-end_of_line = lf
 insert_final_newline = true
-trim_trailing_whitespace = true
\ No newline at end of file
+trim_trailing_whitespace = true
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8b3ba824..ba275de1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,13 @@
 # Changelog
 
+# 04 October 2016
+
+- Migrate to webpack 2
+
+# 18 September 2016
+
+- Using `awesome-typescript-loader` instead of `ts-loader`.
+
 # 5 September 2016
 
 - Migration to TS2 and @types
diff --git a/README.md b/README.md
index c79ca104..5f91819a 100644
--- a/README.md
+++ b/README.md
@@ -1,34 +1,27 @@
-# angular2-webpack
+# angular-webpack
 
-[![Dependency Status](https://david-dm.org/preboot/angular2-webpack/status.svg)](https://david-dm.org/preboot/angular2-webpack#info=dependencies) [![devDependency Status](https://david-dm.org/preboot/angular2-webpack/dev-status.svg)](https://david-dm.org/preboot/angular2-webpack#info=devDependencies)
-[![Join the chat at https://gitter.im/preboot/angular2-webpack](https://badges.gitter.im/preboot/angular2-webpack.svg)](https://gitter.im/preboot/angular2-webpack?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+[![Dependency Status](https://david-dm.org/preboot/angular-webpack/status.svg)](https://david-dm.org/preboot/angular-webpack#info=dependencies) [![devDependency Status](https://david-dm.org/preboot/angular-webpack/dev-status.svg)](https://david-dm.org/preboot/angular-webpack#info=devDependencies)
+[![Join the chat at https://gitter.im/preboot/angular-webpack](https://badges.gitter.im/preboot/angular-webpack.svg)](https://gitter.im/preboot/angular-webpack?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 
-**Note: This guide is following the Angular's [Style Guide](http://angular.io/styleguide) so I will be changing conventions here and there eventually. You are free to use your own conventions with this starter.**
-**Note 2: There is no conventions yet for RC5 on the style guide so there will be a future update here for that.**
+A complete, yet simple, starter for Angular v2+ using Webpack.
 
-A complete, yet simple, starter for Angular 2 using Webpack.
-
-This seed repo serves as an Angular 2 starter for anyone looking to get up and running with Angular 2 and TypeScript fast. Using [Webpack](http://webpack.github.io/) for building our files and assisting with boilerplate. We're also using Protractor for our end-to-end story and Karma for our unit tests.
-* Best practices in file and application organization for [Angular 2](https://angular.io/).
+This seed repo serves as an Angular starter for anyone looking to get up and running with Angular and TypeScript fast. Using [Webpack](http://webpack.github.io/) for building our files and assisting with boilerplate. We're also using Protractor for our end-to-end story and Karma for our unit tests.
+* Best practices in file and application organization for [Angular](https://angular.io/).
 * Ready to go build system using [Webpack](https://webpack.github.io/docs/) for working with [TypeScript](http://www.typescriptlang.org/).
-* Testing Angular 2 code with [Jasmine](http://jasmine.github.io/) and [Karma](http://karma-runner.github.io/).
+* Testing Angular code with [Jasmine](http://jasmine.github.io/) and [Karma](http://karma-runner.github.io/).
 * Coverage with [Istanbul](https://github.com/gotwarlost/istanbul)
-* End-to-end Angular 2 code using [Protractor](https://angular.github.io/protractor/).
+* End-to-end Angular code using [Protractor](https://angular.github.io/protractor/).
 * Stylesheets with [SASS](http://sass-lang.com/) (not required, it supports regular css too).
 * Error reported with [TSLint](http://palantir.github.io/tslint/) and [Codelyzer](https://github.com/mgechev/codelyzer).
-* Documentation with [TypeDoc](http://typedoc.io/).
+* Documentation with [TypeDoc](http://typedoc.org/).
 
 >Warning: Make sure you're using the latest version of Node.js and NPM
 
-[Is Angular 2 Ready Yet?](http://splintercode.github.io/is-angular-2-ready/)
-
 ### Quick start
 
-> Clone/Download the repo then edit `app.ts` inside [`/src/app/app.component.ts`](/src/app/app.component.ts)
-
 ```bash
 # clone our repo
-$ git clone https://github.com/preboot/angular2-webpack.git my-app
+$ git clone https://github.com/preboot/angular-webpack.git my-app
 
 # change directory to your app
 $ cd my-app
@@ -60,7 +53,7 @@ go to [http://localhost:8080](http://localhost:8080) in your browser.
 
 What you need to run this app:
 * `node` and `npm` (Use [NVM](https://github.com/creationix/nvm))
-* Ensure you're running Node (`v5.x.x`+) and NPM (`3.x.x`+)
+* Ensure you're running Node (`v6.x.x`+) and NPM (`3.x.x`+)
 
 ## Installing
 
@@ -110,7 +103,7 @@ You can now go to `/dist` and deploy that to your server!
 
 ## Documentation
 
-You can generate api docs (using [TypeDoc](http://typedoc.io/)) for your code with the following:
+You can generate api docs (using [TypeDoc](http://typedoc.org/)) for your code with the following:
 
 * `npm run docs`
 
@@ -120,19 +113,19 @@ You can generate api docs (using [TypeDoc](http://typedoc.io/)) for your code wi
 
 No, Webpack will add all the needed Javascript bundles as script tags and all the CSS files as link tags. The advantage is that you don't need to modify the index.html every time you build your solution to update the hashes.
 
-#### How to include external angular 2 libraries ?
+#### How to include external angular libraries ?
 
-It's simple, just install the lib via npm and import it in your code when you need it. Don't forget that you need to configure some external libs in the [bootstrap](https://github.com/preboot/angular2-webpack/blob/master/src/main.ts) of your application.
+It's simple, just install the lib via npm and import it in your code when you need it. Don't forget that you need to configure some external libs in the [bootstrap](https://github.com/preboot/angular-webpack/blob/master/src/main.ts) of your application.
 
 #### How to include external css files such as bootstrap.css ?
 
-Just install the lib and import the css files in [vendor.ts](https://github.com/preboot/angular2-webpack/blob/master/src/vendor.ts). For example this is how to do it with bootstrap:
+Just install the lib and import the css files in [vendor.ts](https://github.com/preboot/angular-webpack/blob/master/src/vendor.ts). For example this is how to do it with bootstrap:
 
 ```sh
 npm install bootstrap@next --save
 ```
 
-And in [vendor.ts](https://github.com/preboot/angular2-webpack/blob/master/src/vendor.ts) add the following:
+And in [vendor.ts](https://github.com/preboot/angular-webpack/blob/master/src/vendor.ts) add the following:
 
 ```ts
 import 'bootstrap/dist/css/bootstrap.css';
diff --git a/karma.conf.js b/karma.conf.js
index 5b654613..91b79ad0 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -2,6 +2,9 @@ var path = require('path');
 
 var webpackConfig = require('./webpack.config');
 
+var ENV = process.env.npm_lifecycle_event;
+var isTestWatch = ENV === 'test-watch';
+
 module.exports = function (config) {
   var _config = {
 
@@ -34,27 +37,6 @@ module.exports = function (config) {
       stats: 'errors-only'
     },
 
-    coverageReporter: {
-      dir: 'coverage/',
-      reporters: [{
-        type: 'json',
-        dir: 'coverage',
-        subdir: 'json',
-        file: 'coverage-final.json'
-      }]
-    },
-
-    remapIstanbulReporter: {
-      src: 'coverage/json/coverage-final.json',
-      reports: {
-        lcovonly: 'coverage/json/lcov.info',
-        html: 'coverage/html',
-        'text': null
-      },
-      timeoutNotCreated: 1000, // default value
-      timeoutNoMoreFiles: 1000 // default value
-    },
-
     webpackServer: {
       noInfo: true // please don't spam the console when running in karma!
     },
@@ -62,7 +44,7 @@ module.exports = function (config) {
     // test results reporter to use
     // possible values: 'dots', 'progress', 'mocha'
     // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ["mocha", "coverage", "karma-remap-istanbul"],
+    reporters: ["mocha"],
 
     // web server port
     port: 9876,
@@ -79,13 +61,27 @@ module.exports = function (config) {
 
     // start these browsers
     // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'], // you can also use Chrome
+    browsers: ['Chrome'],
 
     // Continuous Integration mode
     // if true, Karma captures browsers, runs the tests and exits
     singleRun: true
   };
 
+  if (!isTestWatch) {
+    _config.reporters.push("coverage");
+
+    _config.coverageReporter = {
+      dir: 'coverage/',
+      reporters: [{
+        type: 'json',
+        dir: 'coverage',
+        subdir: 'json',
+        file: 'coverage-final.json'
+      }]
+    };
+  }
+
   config.set(_config);
 
 };
diff --git a/package.json b/package.json
index 2568e28e..27ea2952 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
     "clean-start": "npm run clean-install && npm start",
     "watch": "webpack --watch --progress --profile",
     "build": "rimraf dist && webpack --progress --profile --bail",
-    "server": "webpack-dashboard -- webpack-dev-server --inline --port 8080",
+    "server": "webpack-dev-server --inline --progress --port 8080",
     "webdriver-update": "webdriver-manager update",
     "webdriver-start": "webdriver-manager start",
     "lint": "tslint --force \"src/**/*.ts\"",
@@ -16,6 +16,7 @@
     "e2e-live": "protractor --elementExplorer",
     "pretest": "npm run lint",
     "test": "karma start",
+    "posttest": "remap-istanbul -i coverage/json/coverage-final.json -o coverage/html -t html",
     "test-watch": "karma start --no-single-run --auto-watch",
     "ci": "npm run e2e && npm run test",
     "docs": "typedoc --options typedoc.json src/app/app.component.ts",
@@ -24,69 +25,65 @@
     "postinstall": "npm run webdriver-update"
   },
   "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/router": "3.0.0",
+    "@angular/common": "~4.2.6",
+    "@angular/compiler": "~4.2.6",
+    "@angular/core": "~4.2.6",
+    "@angular/forms": "~4.2.6",
+    "@angular/http": "~4.2.6",
+    "@angular/platform-browser": "~4.2.6",
+    "@angular/platform-browser-dynamic": "~4.2.6",
+    "@angular/router": "~4.2.6",
     "core-js": "^2.4.1",
     "reflect-metadata": "^0.1.3",
-    "rxjs": "5.0.0-beta.12",
-    "zone.js": "^0.6.21"
+    "tslib": "^1.7.1",
+    "rxjs": "^5.0.1",
+    "zone.js": "^0.8.10"
   },
   "devDependencies": {
     "@angularclass/hmr": "^1.0.1",
-    "@angularclass/hmr-loader": "^1.0.0",
-    "@types/core-js": "^0.9.0",
-    "@types/jasmine": "^2.2.29",
+    "@angularclass/hmr-loader": "^3.0.2",
+    "@types/jasmine": "^2.5.41",
     "@types/node": "^6.0.38",
-    "@types/protractor": "^1.5.16",
-    "@types/selenium-webdriver": "^2.44.26",
-    "angular2-template-loader": "^0.4.0",
+    "@types/selenium-webdriver": "2.53.39",
+    "angular2-template-loader": "^0.6.0",
     "autoprefixer": "^6.3.2",
-    "codelyzer": "0.0.26",
-    "copy-webpack-plugin": "^3.0.0",
-    "css-loader": "^0.23.0",
-    "extract-text-webpack-plugin": "^1.0.1",
-    "file-loader": "^0.9.0",
+    "awesome-typescript-loader": "^3.1.2",
+    "codelyzer": "2.0.0",
+    "copy-webpack-plugin": "^4.0.0",
+    "css-loader": "^0.28.4",
+    "extract-text-webpack-plugin": "^2.0.0-beta.4",
+    "file-loader": "^0.10.0",
     "html-loader": "^0.4.0",
     "html-webpack-plugin": "^2.8.1",
     "istanbul-instrumenter-loader": "^0.2.0",
     "jasmine-core": "^2.3.4",
-    "jasmine-spec-reporter": "^2.4.0",
+    "jasmine-spec-reporter": "^3.2.0",
     "json-loader": "^0.5.3",
-    "karma": "1.1.2",
-    "karma-chrome-launcher": "^1.0.1",
+    "karma": "1.4.1",
+    "karma-chrome-launcher": "^2.0.0",
     "karma-coverage": "^1.0.0",
     "karma-jasmine": "^1.0.2",
     "karma-mocha-reporter": "^2.0.3",
-    "karma-phantomjs-launcher": "^1.0.0",
-    "karma-remap-istanbul": "0.1.1",
+    "karma-remap-istanbul": "0.2.1",
     "karma-sourcemap-loader": "^0.3.7",
-    "karma-webpack": "1.7.0",
-    "node-sass": "^3.4.2",
+    "karma-webpack": "2.0.2",
+    "node-sass": "^4.5.0",
     "null-loader": "0.1.1",
-    "phantomjs-prebuilt": "^2.1.4",
-    "postcss-loader": "^0.9.1",
-    "protractor": "^3.1.1",
+    "postcss-loader": "^1.1.0",
+    "protractor": "^4.0.10",
     "raw-loader": "0.5.1",
     "remap-istanbul": "^0.6.4",
     "rimraf": "^2.5.1",
-    "sass-loader": "^4.0.0",
+    "sass-loader": "^6.0.1",
     "shelljs": "^0.7.0",
     "style-loader": "^0.13.0",
     "ts-helpers": "^1.1.1",
-    "ts-loader": "^0.8.1",
-    "tslint": "^3.4.0",
-    "tslint-loader": "^2.1.0",
-    "typedoc": "^0.4.4",
-    "typescript": "2.0.2",
+    "tslint": "^4.3.1",
+    "tslint-loader": "^3.3.0",
+    "typedoc": "^0.5.1",
+    "typescript": "^2.3.1",
     "url-loader": "^0.5.6",
-    "webpack": "^1.12.13",
-    "webpack-dashboard": "^0.1.8",
-    "webpack-dev-server": "^1.14.1"
+    "webpack": "2.2.1",
+    "webpack-dev-server": "2.3.0"
   }
 }
diff --git a/protractor.conf.js b/protractor.conf.js
index 12b68e5d..f2253b39 100644
--- a/protractor.conf.js
+++ b/protractor.conf.js
@@ -24,7 +24,7 @@ exports.config = {
   },
 
   onPrepare: function () {
-    var SpecReporter = require('jasmine-spec-reporter');
+    var SpecReporter = require('jasmine-spec-reporter').SpecReporter;
     // add jasmine spec reporter
     jasmine.getEnv().addReporter(new SpecReporter({displayStacktrace: true}));
 
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 208e6687..b3b9f295 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -5,7 +5,7 @@
   </nav>
 </header>
 <main>
-  <h1>Hello from {{api.title}}!</h1>
+  <h1>Hello from {{title}}!</h1>
 
   <!-- Images (and assets) are parsed and loaded from within the public directory -->
   <img src="http://github.com/img/angular.png">
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 4fc43212..01950b8a 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -11,8 +11,9 @@ import '../style/app.scss';
 })
 export class AppComponent {
   url = 'https://github.com/preboot/angular2-webpack';
+  title: string;
 
   constructor(private api: ApiService) {
-    // Do something with api
+    this.title = this.api.title;
   }
 }
diff --git a/tsconfig.json b/tsconfig.json
index 86193a48..0d06b7cf 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,14 +6,14 @@
     "experimentalDecorators": true,
     "sourceMap": true,
     "noEmitHelpers": true,
-    "types": [
-      "core-js",
-      "jasmine",
-      "node",
-      "protractor",
-      "selenium-webdriver"
-    ]
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "lib": ["es2015", "dom"]
   },
   "compileOnSave": false,
-  "buildOnSave": false
+  "buildOnSave": false,
+  "awesomeTypescriptLoaderOptions": {
+    "forkChecker": true,
+    "useWebpackText": true
+  }
 }
diff --git a/tslint.json b/tslint.json
index 41c6c0e1..2c31441e 100644
--- a/tslint.json
+++ b/tslint.json
@@ -16,7 +16,6 @@
       "spaces"
     ],
     "label-position": true,
-    "label-undefined": true,
     "max-line-length": [
       true,
       140
@@ -39,7 +38,6 @@
     ],
     "no-construct": true,
     "no-debugger": true,
-    "no-duplicate-key": true,
     "no-duplicate-variable": true,
     "no-empty": false,
     "no-eval": true,
@@ -49,8 +47,6 @@
     "no-switch-case-fall-through": true,
     "no-trailing-whitespace": true,
     "no-unused-expression": true,
-    "no-unused-variable": true,
-    "no-unreachable": true,
     "no-use-before-declare": true,
     "no-var-keyword": true,
     "object-literal-sort-keys": false,
@@ -92,11 +88,18 @@
       "check-separator",
       "check-type"
     ],
-
-    "directive-selector-name": [true, "camelCase"],
-    "component-selector-name": [true, "kebab-case"],
-    "directive-selector-type": [true, "attribute"],
-    "component-selector-type": [true, "element"],
+    "directive-selector": [
+      true,
+      "attribute",
+      "my",
+      "camelCase"
+    ],
+    "component-selector": [
+      true,
+      "element",
+      "my",
+      "kebab-case"
+    ],
     "use-input-property-decorator": true,
     "use-output-property-decorator": true,
     "use-host-property-decorator": true,
@@ -106,8 +109,16 @@
     "use-pipe-transform-interface": true,
     "component-class-suffix": true,
     "directive-class-suffix": true,
-    "directive-selector-prefix": [true, "my"],
-    "component-selector-prefix": [true, "my"],
-    "pipe-naming": [true, "camelCase", "my"]
+    "pipe-naming": [
+      true,
+      "camelCase",
+      "my"
+    ],
+    "no-attribute-parameter-decorator": true,
+    "no-forward-ref": true,
+    "import-destructuring-spacing": true,
+    "no-access-missing-member": true,
+    "templates-use-public": true,
+    "invoke-injectable": true
   }
 }
diff --git a/webpack.config.js b/webpack.config.js
index ae3124e4..93e0ced9 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -8,14 +8,14 @@ var autoprefixer = require('autoprefixer');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
 var ExtractTextPlugin = require('extract-text-webpack-plugin');
 var CopyWebpackPlugin = require('copy-webpack-plugin');
-var DashboardPlugin = require('webpack-dashboard/plugin');
 
 /**
  * Env
  * Get npm lifecycle event to identify the environment
  */
 var ENV = process.env.npm_lifecycle_event;
-var isTest = ENV === 'test' || ENV === 'test-watch';
+var isTestWatch = ENV === 'test-watch';
+var isTest = ENV === 'test' || isTestWatch;
 var isProd = ENV === 'build';
 
 module.exports = function makeWebpackConfig() {
@@ -33,22 +33,25 @@ module.exports = function makeWebpackConfig() {
    */
   if (isProd) {
     config.devtool = 'source-map';
-  } else {
+  }
+  else if (isTest) {
+    config.devtool = 'inline-source-map';
+  }
+  else {
     config.devtool = 'eval-source-map';
   }
 
-  // add debug messages
-  config.debug = !isProd || !isTest;
-
-  /**
-   * Entry
-   * Reference: http://webpack.github.io/docs/configuration.html#entry
-   */
-  config.entry = isTest ? {} : {
-    'polyfills': './src/polyfills.ts',
-    'vendor': './src/vendor.ts',
-    'app': './src/main.ts' // our angular app
-  };
+  if (!isTest) {
+    /**
+     * Entry
+     * Reference: http://webpack.github.io/docs/configuration.html#entry
+     */
+    config.entry = isTest ? {} : {
+      'polyfills': './src/polyfills.ts',
+      'vendor': './src/vendor.ts',
+      'app': './src/main.ts' // our angular app
+    };
+  }
 
   /**
    * Output
@@ -66,16 +69,16 @@ module.exports = function makeWebpackConfig() {
    * Reference: http://webpack.github.io/docs/configuration.html#resolve
    */
   config.resolve = {
-    cache: !isTest,
-    root: root(),
     // only discover files that have those extensions
-    extensions: ['', '.ts', '.js', '.json', '.css', '.scss', '.html'],
-    alias: {
-      'app': 'src/app',
-      'common': 'src/common'
-    }
+    extensions: ['.ts', '.js', '.json', '.css', '.scss', '.html'],
   };
 
+  var atlOptions = '';
+  if (isTest && !isTestWatch) {
+    // awesome-typescript-loader needs to output inlineSourceMap for code coverage to work with source maps.
+    atlOptions = 'inlineSourceMap=true&sourceMap=false';
+  }
+
   /**
    * Loaders
    * Reference: http://webpack.github.io/docs/configuration.html#module-loaders
@@ -83,23 +86,22 @@ module.exports = function makeWebpackConfig() {
    * This handles most of the magic responsible for converting modules
    */
   config.module = {
-    preLoaders: isTest ? [] : [{test: /\.ts$/, loader: 'tslint'}],
-    loaders: [
+    rules: [
       // Support for .ts files.
       {
         test: /\.ts$/,
-        loaders: ['ts', 'angular2-template-loader', '@angularclass/hmr-loader'],
+        loaders: ['awesome-typescript-loader?' + atlOptions, 'angular2-template-loader', '@angularclass/hmr-loader'],
         exclude: [isTest ? /\.(e2e)\.ts$/ : /\.(spec|e2e)\.ts$/, /node_modules\/(?!(ng2-.+))/]
       },
 
       // copy those assets to output
       {
         test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-        loader: 'file?name=fonts/[name].[hash].[ext]?'
+        loader: 'file-loader?name=fonts/[name].[hash].[ext]?'
       },
 
       // Support for *.json files.
-      {test: /\.json$/, loader: 'json'},
+      {test: /\.json$/, loader: 'json-loader'},
 
       // Support for CSS as raw text
       // use 'null' loader in test mode (https://github.com/webpack/null-loader)
@@ -107,46 +109,46 @@ module.exports = function makeWebpackConfig() {
       {
         test: /\.css$/,
         exclude: root('src', 'app'),
-        loader: isTest ? 'null' : ExtractTextPlugin.extract('style', 'css?sourceMap!postcss')
+        loader: isTest ? 'null-loader' : ExtractTextPlugin.extract({ fallback: 'style-loader', use: ['css-loader', 'postcss-loader']})
       },
       // all css required in src/app files will be merged in js files
-      {test: /\.css$/, include: root('src', 'app'), loader: 'raw!postcss'},
+      {test: /\.css$/, include: root('src', 'app'), loader: 'raw-loader!postcss-loader'},
 
       // support for .scss files
       // use 'null' loader in test mode (https://github.com/webpack/null-loader)
       // all css in src/style will be bundled in an external css file
       {
-        test: /\.scss$/,
+        test: /\.(scss|sass)$/,
         exclude: root('src', 'app'),
-        loader: isTest ? 'null' : ExtractTextPlugin.extract('style', 'css?sourceMap!postcss!sass')
+        loader: isTest ? 'null-loader' : ExtractTextPlugin.extract({ fallback: 'style-loader', use: ['css-loader', 'postcss-loader', 'sass-loader']})
       },
       // all css required in src/app files will be merged in js files
-      {test: /\.scss$/, exclude: root('src', 'style'), loader: 'raw!postcss!sass'},
+      {test: /\.(scss|sass)$/, exclude: root('src', 'style'), loader: 'raw-loader!postcss-loader!sass-loader'},
 
       // support for .html as raw text
       // todo: change the loader to something that adds a hash to images
-      {test: /\.html$/, loader: 'raw',  exclude: root('src', 'public')}
-    ],
-    postLoaders: []
+      {test: /\.html$/, loader: 'raw-loader',  exclude: root('src', 'public')}
+    ]
   };
 
-  if (isTest) {
+  if (isTest && !isTestWatch) {
     // instrument only testing sources with Istanbul, covers ts files
-    config.module.postLoaders.push({
+    config.module.rules.push({
       test: /\.ts$/,
+      enforce: 'post',
       include: path.resolve('src'),
       loader: 'istanbul-instrumenter-loader',
       exclude: [/\.spec\.ts$/, /\.e2e\.ts$/, /node_modules/]
     });
+  }
 
-    // needed for remap-instanbul
-    config.ts = {
-      compilerOptions: {
-        sourceMap: false,
-        sourceRoot: './src',
-        inlineSourceMap: true
-      }
-    };
+  if (!isTest || !isTestWatch) {
+    // tslint support
+    config.module.rules.push({
+      test: /\.ts$/,
+      enforce: 'pre',
+      loader: 'tslint-loader'
+    });
   }
 
   /**
@@ -162,14 +164,49 @@ module.exports = function makeWebpackConfig() {
       'process.env': {
         ENV: JSON.stringify(ENV)
       }
+    }),
+
+    // Workaround needed for angular 2 angular/angular#11580
+    new webpack.ContextReplacementPlugin(
+      // The (\\|\/) piece accounts for path separators in *nix and Windows
+      /angular(\\|\/)core(\\|\/)@angular/,
+      root('./src') // location of your src
+    ),
+
+    // Tslint configuration for webpack 2
+    new webpack.LoaderOptionsPlugin({
+      options: {
+        /**
+         * Apply the tslint loader as pre/postLoader
+         * Reference: https://github.com/wbuchwalter/tslint-loader
+         */
+        tslint: {
+          emitErrors: false,
+          failOnHint: false
+        },
+        /**
+         * Sass
+         * Reference: https://github.com/jtangelder/sass-loader
+         * Transforms .scss files to .css
+         */
+        sassLoader: {
+          //includePaths: [path.resolve(__dirname, "node_modules/foundation-sites/scss")]
+        },
+        /**
+         * PostCSS
+         * Reference: https://github.com/postcss/autoprefixer-core
+         * Add vendor prefixes to your css
+         */
+        postcss: [
+          autoprefixer({
+            browsers: ['last 2 version']
+          })
+        ]
+      }
     })
   ];
 
-  if (!isTest && !isProd) {
-      config.plugins.push(new DashboardPlugin());
-  }
-
-  if (!isTest) {
+  if (!isTest && !isTestWatch) {
     config.plugins.push(
       // Generate common chunks if necessary
       // Reference: https://webpack.github.io/docs/code-splitting.html
@@ -188,7 +225,7 @@ module.exports = function makeWebpackConfig() {
       // Extract css files
       // Reference: https://github.com/webpack/extract-text-webpack-plugin
       // Disabled when in test mode or not in build mode
-      new ExtractTextPlugin('css/[name].[hash].css', {disable: !isProd})
+      new ExtractTextPlugin({filename: 'css/[name].[hash].css', disable: !isProd})
     );
   }
 
@@ -197,15 +234,15 @@ module.exports = function makeWebpackConfig() {
     config.plugins.push(
       // Reference: http://webpack.github.io/docs/list-of-plugins.html#noerrorsplugin
       // Only emit files when there are no errors
-      new webpack.NoErrorsPlugin(),
+      new webpack.NoEmitOnErrorsPlugin(),
 
-      // Reference: http://webpack.github.io/docs/list-of-plugins.html#dedupeplugin
-      // Dedupe modules in the output
-      new webpack.optimize.DedupePlugin(),
+      // // Reference: http://webpack.github.io/docs/list-of-plugins.html#dedupeplugin
+      // // Dedupe modules in the output
+      // new webpack.optimize.DedupePlugin(),
 
       // Reference: http://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin
       // Minify all javascript, switch loaders to minimizing mode
-      new webpack.optimize.UglifyJsPlugin({mangle: { keep_fnames: true }}),
+      new webpack.optimize.UglifyJsPlugin({sourceMap: true, mangle: { keep_fnames: true }}),
 
       // Copy assets from the public folder
       // Reference: https://github.com/kevlened/copy-webpack-plugin
@@ -215,35 +252,6 @@ module.exports = function makeWebpackConfig() {
     );
   }
 
-  /**
-   * PostCSS
-   * Reference: https://github.com/postcss/autoprefixer-core
-   * Add vendor prefixes to your css
-   */
-  config.postcss = [
-    autoprefixer({
-      browsers: ['last 2 version']
-    })
-  ];
-
-  /**
-   * Sass
-   * Reference: https://github.com/jtangelder/sass-loader
-   * Transforms .scss files to .css
-   */
-  config.sassLoader = {
-    //includePaths: [path.resolve(__dirname, "node_modules/foundation-sites/scss")]
-  };
-
-  /**
-   * Apply the tslint loader as pre/postLoader
-   * Reference: https://github.com/wbuchwalter/tslint-loader
-   */
-  config.tslint = {
-    emitErrors: false,
-    failOnHint: false
-  };
-
   /**
    * Dev server configuration
    * Reference: http://webpack.github.io/docs/configuration.html#devserver