webpack.prod.conf.js 4.1 KB

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