From 7a05a925478541fce9221c0fc876a7785da1c2b2 Mon Sep 17 00:00:00 2001
From: Marcos Moura <marcosvmmoura@gmail.com>
Date: Fri, 22 Jul 2016 02:37:52 -0300
Subject: [PATCH] Improve webpack configs

---
 build/webpack.prod.conf.js | 46 ++++++++++++++++++--------------------
 index.html                 |  1 +
 2 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js
index 8e3cbc9..3593393 100644
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@@ -1,28 +1,26 @@
-var path = require('path')
-var config = require('../config')
-var utils = require('./utils')
-var webpack = require('webpack')
-var merge = require('webpack-merge')
-var baseWebpackConfig = require('./webpack.base.conf')
-var ExtractTextPlugin = require('extract-text-webpack-plugin')
-var HtmlWebpackPlugin = require('html-webpack-plugin')
-var env = process.env.NODE_ENV === 'testing'
-  ? require('../config/test.env')
-  : config.build.env
+var path = require('path');
+var config = require('../config');
+var utils = require('./utils');
+var webpack = require('webpack');
+var merge = require('webpack-merge');
+var baseWebpackConfig = require('./webpack.base.conf');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+var env = process.env.NODE_ENV === 'testing' ? require('../config/test.env') : config.build.env;
 
 var webpackConfig = merge(baseWebpackConfig, {
   module: {
-    loaders: utils.styleLoaders({ sourceMap: config.build.productionSourceMap, extract: true })
+    loaders: utils.styleLoaders({
+      extract: true
+    })
   },
-  devtool: config.build.productionSourceMap ? '#source-map' : false,
   output: {
     path: config.build.assetsRoot,
-    filename: utils.assetsPath('js/[name].[chunkhash].js'),
-    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
+    filename: utils.assetsPath('[name].min.js'),
+    chunkFilename: utils.assetsPath('[id].min.js')
   },
   vue: {
     loaders: utils.cssLoaders({
-      sourceMap: config.build.productionSourceMap,
       extract: true
     })
   },
@@ -38,7 +36,7 @@ var webpackConfig = merge(baseWebpackConfig, {
     }),
     new webpack.optimize.OccurenceOrderPlugin(),
     // extract css into its own file
-    new ExtractTextPlugin(utils.assetsPath('css/[name].[contenthash].css')),
+    new ExtractTextPlugin(utils.assetsPath('[name].min.css')),
     // generate dist index.html with correct asset hash for caching.
     // you can customize output by editing /index.html
     // see https://github.com/ampedandwired/html-webpack-plugin
@@ -59,15 +57,15 @@ var webpackConfig = merge(baseWebpackConfig, {
     // split vendor js into its own file
     new webpack.optimize.CommonsChunkPlugin({
       name: 'vendor',
-      minChunks: function (module, count) {
+      minChunks: function(module) {
         // any required modules inside node_modules are extracted to vendor
         return (
           module.resource &&
-          /\.js$/.test(module.resource) &&
+          (/\.js$/).test(module.resource) &&
           module.resource.indexOf(
             path.join(__dirname, '../node_modules')
           ) === 0
-        )
+        );
       }
     }),
     // extract webpack runtime and module manifest to its own file in order to
@@ -77,10 +75,10 @@ var webpackConfig = merge(baseWebpackConfig, {
       chunks: ['vendor']
     })
   ]
-})
+});
 
 if (config.build.productionGzip) {
-  var CompressionWebpackPlugin = require('compression-webpack-plugin')
+  var CompressionWebpackPlugin = require('compression-webpack-plugin');
 
   webpackConfig.plugins.push(
     new CompressionWebpackPlugin({
@@ -94,7 +92,7 @@ if (config.build.productionGzip) {
       threshold: 10240,
       minRatio: 0.8
     })
-  )
+  );
 }
 
-module.exports = webpackConfig
+module.exports = webpackConfig;
diff --git a/index.html b/index.html
index 5e4825f..da7b4ce 100644
--- a/index.html
+++ b/index.html
@@ -42,6 +42,7 @@
           <md-list-item v-link="sidenav">Sidenav</md-list-item>
           <md-list-item v-link="theme">Theme</md-list-item>
           <md-list-item v-link="toolbar">Toolbar</md-list-item>
+          <md-list-item v-link="whiteframe">Whiteframe</md-list-item>
         </md-list>
       </md-sidenav>