webpack.prod.js 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. const merge = require('webpack-merge');
  2. const common = require('./webpack.common.js');
  3. const OptimizeCssAssesetsPlugin = require('optimize-css-assets-webpack-plugin');
  4. const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
  5. const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  6. const { CleanWebpackPlugin } = require('clean-webpack-plugin');
  7. module.exports = merge(common,{
  8. mode:'production',
  9. devtool:'source-map',
  10. optimization:{
  11. splitChunks:{
  12. chunks:'all',
  13. cacheGroups:{
  14. vendor:{
  15. name:'vendor',
  16. test:/[\\/]node_modules[\\/]/,
  17. priority:-10,
  18. chunks:'initial'
  19. }
  20. }
  21. },
  22. minimizer:[
  23. new UglifyJsPlugin({
  24. uglifyOptions:{
  25. warnings: false, // 去除警告
  26. compress:{
  27. drop_debugger: true, // 去除debugger
  28. drop_console: true // 去除console.log
  29. }
  30. },
  31. // cache:true,
  32. // parallel:true,
  33. sourceMap:false,
  34. }),
  35. // new OptimizeCssAssesetsPlugin({})
  36. ]
  37. },
  38. plugins:[
  39. new CleanWebpackPlugin(),
  40. /*new MiniCssExtractPlugin({
  41. filename: 'css/[name].[hash].css',
  42. // chunkFilename: 'js/[id].[hash].css',
  43. chunkFilename: 'css/[hash].[hash].css',
  44. }),*/
  45. ],
  46. /*module: {
  47. rules: [{
  48. test:/\.css$/,
  49. use:[{
  50. loader: MiniCssExtractPlugin.loader,
  51. options: {
  52. // filename:'[name].css',
  53. // chunkFilename:'[name].css',
  54. minimize: true,
  55. publicPath: '../'
  56. }
  57. },
  58. 'css-loader',
  59. {
  60. loader:'css-loader',
  61. options:{
  62. importLoaders: 2 //该方式可以让@import引入的css文件再次执行一边css打包loader
  63. }
  64. }
  65. ]
  66. },
  67. {
  68. test:/\.less$/,
  69. use:[
  70. {
  71. loader: MiniCssExtractPlugin.loader,
  72. options: {
  73. minimize: true,
  74. publicPath: '../'
  75. }
  76. },
  77. 'style-loader',
  78. 'css-loader',
  79. 'less-loader'
  80. ]
  81. }
  82. ]
  83. }*/
  84. });