webpack.prod.conf.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  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 JavaScriptObfuscator = require('webpack-obfuscator');
  12. const DefinePlugin = require('webpack/lib/DefinePlugin');
  13. const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin');
  14. var env = '';
  15. if (process.env.NODE_ENV === 'testing') {
  16. env = require('../config/test.env')
  17. } else if (process.env.NODE_ENV === 'rc') {
  18. env = require('../config/rc.env')
  19. } else if (process.env.NODE_ENV === 'import') {
  20. env = require('../config/import.env')
  21. } else {
  22. env = config.build.env
  23. }
  24. // var env = process.env.NODE_ENV === 'testing'
  25. // ? require('../config/test.env')
  26. // : config.build.env
  27. console.log(' settting up evn='+env.NODE_ENV+'\n');
  28. console.log('productionSourceMap = '+ config.build.productionSourceMap + '\n');
  29. console.log('assetsRoot = '+ config.build.assetsRoot + '\n');
  30. console.log('assetsSubDirectory = '+ config.build.assetsSubDirectory + '\n');
  31. console.log('utils access path = '+utils.assetsPath('js')+'/n');
  32. var webpackConfig = merge(baseWebpackConfig, {
  33. module: {
  34. rules: utils.styleLoaders({
  35. sourceMap: config.build.productionSourceMap,
  36. extract: true
  37. })
  38. },
  39. devtool: config.build.productionSourceMap ? '#source-map' : false,
  40. output: {
  41. path: config.build.assetsRoot,
  42. filename: utils.assetsPath('js/[name].[chunkhash].js'),
  43. chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
  44. },
  45. plugins: [
  46. new JavaScriptObfuscator({
  47. compact: true,
  48. rotateStringArray: true,
  49. stringArrayEncoding: true,
  50. stringArray: true,
  51. rotateUnicodeArray: true
  52. }, []),
  53. // http://vuejs.github.io/vue-loader/en/workflow/production.html
  54. new webpack.DefinePlugin({
  55. 'process.env': env
  56. }),
  57. new ParallelUglifyPlugin({
  58. // 传递给 UglifyJS 的参数
  59. uglifyJS: {
  60. output: {
  61. // 最紧凑的输出
  62. beautify: false,
  63. // 删除所有的注释
  64. comments: false,
  65. },
  66. compress: {
  67. // 在UglifyJs删除没有用到的代码时不输出警告
  68. warnings: false,
  69. // 删除所有的 `console` 语句,可以兼容ie浏览器
  70. drop_console: true,
  71. // 内嵌定义了但是只用到一次的变量
  72. collapse_vars: true,
  73. // 提取出出现多次但是没有定义成变量去引用的静态值
  74. reduce_vars: true,
  75. }
  76. },
  77. }),
  78. // extract css into its own file
  79. new ExtractTextPlugin({
  80. filename: utils.assetsPath('css/[name].[contenthash].css')
  81. }),
  82. // Compress extracted CSS. We are using this plugin so that possible
  83. // duplicated CSS from different components can be deduped.
  84. new OptimizeCSSPlugin({
  85. cssProcessorOptions: {
  86. safe: true
  87. }
  88. }),
  89. // generate dist index.html with correct asset hash for caching.
  90. // you can customize output by editing /index.html
  91. // see https://github.com/ampedandwired/html-webpack-plugin
  92. new HtmlWebpackPlugin({
  93. filename: config.build.index,
  94. template: 'index.html',
  95. inject: true,
  96. minify: {
  97. removeComments: true,
  98. collapseWhitespace: true,
  99. removeAttributeQuotes: true
  100. // more options:
  101. // https://github.com/kangax/html-minifier#options-quick-reference
  102. },
  103. // necessary to consistently work with multiple chunks via CommonsChunkPlugin
  104. chunksSortMode: 'dependency'
  105. }),
  106. // split vendor js into its own file
  107. new webpack.optimize.CommonsChunkPlugin({
  108. name: 'vendor',
  109. minChunks: function (module, count) {
  110. // any required modules inside node_modules are extracted to vendor
  111. return (
  112. module.resource &&
  113. /\.js$/.test(module.resource) &&
  114. module.resource.indexOf(
  115. path.join(__dirname, '../node_modules')
  116. ) === 0
  117. )
  118. }
  119. }),
  120. // extract webpack runtime and module manifest to its own file in order to
  121. // prevent vendor hash from being updated whenever app bundle is updated
  122. new webpack.optimize.CommonsChunkPlugin({
  123. name: 'manifest',
  124. chunks: ['vendor']
  125. }),
  126. // copy custom static assets
  127. new CopyWebpackPlugin([
  128. {
  129. from: path.resolve(__dirname, '../static'),
  130. to: config.build.assetsSubDirectory,
  131. ignore: ['.*']
  132. }
  133. ])
  134. ]
  135. })
  136. if (config.build.productionGzip) {
  137. var CompressionWebpackPlugin = require('compression-webpack-plugin')
  138. webpackConfig.plugins.push(
  139. new CompressionWebpackPlugin({
  140. asset: '[path].gz[query]',
  141. algorithm: 'gzip',
  142. test: new RegExp(
  143. '\\.(' +
  144. config.build.productionGzipExtensions.join('|') +
  145. ')$'
  146. ),
  147. threshold: 10240,
  148. minRatio: 0.8
  149. })
  150. )
  151. }
  152. if (config.build.bundleAnalyzerReport) {
  153. var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
  154. webpackConfig.plugins.push(new BundleAnalyzerPlugin())
  155. }
  156. module.exports = webpackConfig