feat(build): use NamedModulesPlugin with HMR

Fix #3679
Close #4037

Author: vdclouis

package.json

@@ -140,7 +140,7 @@
     "@types/rimraf": "0.0.25-alpha",
     "@types/semver": "^5.3.30",
     "@types/source-map": "^0.5.0",
-    "@types/webpack": "^1.12.22-alpha",
+    "@types/webpack": "2.2.0",
     "chai": "^3.5.0",
     "conventional-changelog": "^1.1.0",
     "dtsgenerator": "^0.7.1",

packages/angular-cli/models/webpack-build-production.ts

@@ -4,16 +4,6 @@ import {CompressionPlugin} from '../lib/webpack/compression-plugin';
 const autoprefixer = require('autoprefixer');
 const postcssDiscardComments = require('postcss-discard-comments');
 
-declare module 'webpack' {
-  export interface LoaderOptionsPlugin {}
-  export interface LoaderOptionsPluginStatic {
-    new (optionsObject: any): LoaderOptionsPlugin;
-  }
-  interface Webpack {
-    LoaderOptionsPlugin: LoaderOptionsPluginStatic;
-  }
-}
-
 export const getWebpackProdConfigPartial = function(projectRoot: string,
                                                     appConfig: any,
                                                     sourcemap: boolean,

packages/angular-cli/tasks/serve-webpack.ts

@@ -58,6 +58,7 @@ export default Task.extend({
       ui.writeLine('  for information on working with HMR for Webpack.');
       entryPoints.push('webpack/hot/dev-server');
       config.plugins.push(new webpack.HotModuleReplacementPlugin());
+      config.plugins.push(new webpack.NamedModulesPlugin());
       if (serveTaskOptions.extractCss) {
         ui.writeLine(oneLine`
           ${chalk.yellow('NOTICE')} (HMR) does not allow for CSS hot reload when used