webpack.prod.js 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  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. module.exports = merge(common,{
  7. mode:'production',
  8. devtool:'source-map',
  9. optimization:{
  10. splitChunks:{
  11. chunks:'all',
  12. cacheGroups:{
  13. vendor:{
  14. name:'vendor',
  15. test:/[\\/]node_modules[\\/]/,
  16. priority:10,
  17. chunks:'initial'
  18. }
  19. }
  20. },
  21. minimizer:[
  22. new UglifyJsPlugin({
  23. uglifyOptions:{
  24. warnings: false, // 去除警告
  25. compress:{
  26. drop_debugger: true, // 去除debugger
  27. drop_console: true // 去除console.log
  28. }
  29. },
  30. cache:true,
  31. parallel:true,
  32. sourceMap:false,
  33. }),
  34. new OptimizeCssAssesetsPlugin({})
  35. ]
  36. },
  37. plugins:[
  38. new MiniCssExtractPlugin({
  39. filename: 'css/[name].[hash].css',
  40. chunkFilename: 'js/[id].[hash].css',
  41. }),
  42. ],
  43. module: {
  44. rules: [{
  45. test:/\.css$/,
  46. use:[{
  47. loader: MiniCssExtractPlugin.loader,
  48. options: {
  49. // you can specify a publicPath here
  50. // by default it use publicPath in webpackOptions.output
  51. publicPath: '../'
  52. }
  53. },
  54. 'css-loader'
  55. ]
  56. },{
  57. test:/\.less$/,
  58. use:[{
  59. loader: MiniCssExtractPlugin.loader,
  60. options:{
  61. publicPath:'../'
  62. }
  63. },
  64. 'css-loader',
  65. 'less-loader'
  66. ]
  67. }]
  68. }
  69. });