Improve webpack configs

This commit is contained in:
Marcos Moura 2016-07-22 02:37:52 -03:00
parent bb14e04218
commit 198adfd4bc
2 changed files with 23 additions and 24 deletions

View file

@ -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;

View file

@ -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>