build/webpack.prod.conf.js

   1 var path = require('path')
   2 var utils = require('./utils')
   3 var webpack = require('webpack')
   4 var config = require('../config')
   5 var merge = require('webpack-merge')
   6 var baseWebpackConfig = require('./webpack.base.conf')
   7 var CopyWebpackPlugin = require('copy-webpack-plugin')
   8 var HtmlWebpackPlugin = require('html-webpack-plugin')
   9 var ExtractTextPlugin = require('extract-text-webpack-plugin')
  10 var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
  11
  12 var env = config.build.env
  13
  14 var webpackConfig = merge(baseWebpackConfig, {
  15   module: {
  16     rules: utils.styleLoaders({
  17       sourceMap: config.build.productionSourceMap,
  18       extract: true
  19     })
  20   },
  21   devtool: config.build.productionSourceMap ? '#source-map' : false,
  22   output: {
  23     path: config.build.assetsRoot,
  24     filename: utils.assetsPath('js/[name].[chunkhash].js'),
  25     chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
  26   },
  27   plugins: [
  28     // http://vuejs.github.io/vue-loader/en/workflow/production.html
  29     new webpack.DefinePlugin({
  30       'process.env': env
  31     }),
  32     new webpack.optimize.UglifyJsPlugin({
  33       compress: {
  34         warnings: false
  35       },
  36       sourceMap: true
  37     }),
  38     // extract css into its own file
  39     new ExtractTextPlugin({
  40       filename: utils.assetsPath('css/[name].[contenthash].css')
  41     }),
  42     // Compress extracted CSS. We are using this plugin so that possible
  43     // duplicated CSS from different components can be deduped.
  44     new OptimizeCSSPlugin({
  45       cssProcessorOptions: {
  46         safe: true
  47       }
  48     }),
  49     // generate dist index.html with correct asset hash for caching.
  50     // you can customize output by editing /index.html
  51     // see https://github.com/ampedandwired/html-webpack-plugin
  52     new HtmlWebpackPlugin({
  53       filename: config.build.index,
  54       template: 'index.html',
  55       inject: true,
  56       minify: {
  57         removeComments: true,
  58         collapseWhitespace: true,
  59         removeAttributeQuotes: true
  60         // more options:
  61         // https://github.com/kangax/html-minifier#options-quick-reference
  62       },
  63       // necessary to consistently work with multiple chunks via CommonsChunkPlugin
  64       chunksSortMode: 'dependency'
  65     }),
  66     // split vendor js into its own file
  67     new webpack.optimize.CommonsChunkPlugin({
  68       name: 'vendor',
  69       minChunks: function (module, count) {
  70         // any required modules inside node_modules are extracted to vendor
  71         return (
  72           module.resource &&
  73           /\.js$/.test(module.resource) &&
  74           module.resource.indexOf(
  75             path.join(__dirname, '../node_modules')
  76           ) === 0
  77         )
  78       }
  79     }),
  80     // extract webpack runtime and module manifest to its own file in order to
  81     // prevent vendor hash from being updated whenever app bundle is updated
  82     new webpack.optimize.CommonsChunkPlugin({
  83       name: 'manifest',
  84       chunks: ['vendor']
  85     }),
  86     // copy custom static assets
  87     new CopyWebpackPlugin([
  88       {
  89         from: path.resolve(__dirname, '../static'),
  90         to: config.build.assetsSubDirectory,
  91         ignore: ['.*']
  92       }
  93     ])
  94   ]
  95 })
  96
  97 if (config.build.productionGzip) {
  98   var CompressionWebpackPlugin = require('compression-webpack-plugin')
  99
 100   webpackConfig.plugins.push(
 101     new CompressionWebpackPlugin({
 102       asset: '[path].gz[query]',
 103       algorithm: 'gzip',
 104       test: new RegExp(
 105         '\\.(' +
 106         config.build.productionGzipExtensions.join('|') +
 107         ')$'
 108       ),
 109       threshold: 10240,
 110       minRatio: 0.8
 111     })
 112   )
 113 }
 114
 115 if (config.build.bundleAnalyzerReport) {
 116   var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 117   webpackConfig.plugins.push(new BundleAnalyzerPlugin())
 118 }
 119
 120 module.exports = webpackConfig