Webpack optimizations and fixes

webapp/Makefile

@@ -1,4 +1,4 @@
-.PHONY: build test
+.PHONY: build test run clean
 
 test:
 	@echo Checking for style guide compliance
@@ -12,7 +12,20 @@ test:
 
 	touch $@
 
-build: .npminstall
-	@echo Building mattermost web client
+build: | .npminstall test
+	@echo Building mattermost Webapp
 
 	npm run build
+
+run: .npminstall
+	@echo Running mattermost Webapp for development
+
+	npm run run
+	
+
+clean:
+	@echo Cleaning Webapp
+
+	rm -rf dist
+	rm -rf node_modules
+	rm .npminstall

webapp/package.json

@@ -31,7 +31,7 @@
     "babel-loader": "6.2.4",
     "babel-plugin-transform-runtime": "6.6.0",
     "babel-polyfill": "6.7.2",
-    "babel-preset-es2015": "6.6.0",
+    "babel-preset-es2015-webpack": "6.4.0",
     "babel-preset-react": "6.5.0",
     "babel-preset-stage-0": "6.5.0",
     "eslint": "2.2.0",
@@ -39,6 +39,7 @@
     "exports-loader": "0.6.3",
     "extract-text-webpack-plugin": "1.0.1",
     "file-loader": "0.8.5",
+    "url-loader": "0.5.7",
     "html-loader": "0.4.3",
     "copy-webpack-plugin": "1.1.1",
     "css-loader": "0.23.1",
@@ -52,6 +53,7 @@
   },
   "scripts": {
       "check": "eslint --ext \".jsx\" --ignore-pattern node_modules --quiet .",
-      "build": "webpack --progress"
+      "build": "webpack --optimize-dedupe",
+      "run": "webpack --progress"
   }
 }

webapp/webpack.config.js

@@ -17,20 +17,21 @@ module.exports = {
         loaders: [
             {
                 test: /\.jsx?$/,
-                loader: 'babel-loader',
+                loader: 'babel',
                 exclude: /(node_modules|non_npm_dependencies)/,
                 query: {
-                    presets: ['react', 'es2015', 'stage-0'],
-                    plugins: ['transform-runtime']
+                    presets: ['react', 'es2015-webpack', 'stage-0'],
+                    plugins: ['transform-runtime'],
+                    cacheDirectory: true
                 }
             },
             {
                 test: /\.json$/,
-                loader: 'json-loader'
+                loader: 'json'
             },
             {
                 test: /(node_modules|non_npm_dependencies)\/.+\.(js|jsx)$/,
-                loader: 'imports-loader',
+                loader: 'imports',
                 query: {
                     $: 'jquery',
                     jQuery: 'jquery'
@@ -46,7 +47,7 @@ module.exports = {
             },
             {
                 test: /\.(png|eot|tiff|svg|woff2|woff|ttf|gif)$/,
-                loader: 'file-loader',
+                loader: 'file',
                 query: {
                     name: 'files/[hash].[ext]'
                 }
@@ -67,7 +68,22 @@ module.exports = {
         htmlExtract,
         new CopyWebpackPlugin([
             {from: 'images/emoji', to: 'emoji'}
-        ])
+        ]),
+        new webpack.optimize.UglifyJsPlugin({
+            'screw-ie8': true,
+            mangle: {
+                toplevel: false
+            },
+            compress: {
+                warnings: false
+            },
+            comments: false
+        }),
+        new webpack.optimize.AggressiveMergingPlugin(),
+        new webpack.LoaderOptionsPlugin({
+            minimize: true,
+            debug: false
+        })
     ],
     resolve: {
         alias: {