webpack.prod.config.js 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. const fs = require('fs-extra');
  2. const path = require('path');
  3. //const webpack = require('webpack');
  4. const { merge } = require('webpack-merge');
  5. const baseWpConfig = require('./webpack.base.config');
  6. const TerserPlugin = require('terser-webpack-plugin');
  7. const CssMinimizerWebpackPlugin = require('css-minimizer-webpack-plugin');
  8. const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  9. const HtmlWebpackPlugin = require('html-webpack-plugin');
  10. const CopyWebpackPlugin = require('copy-webpack-plugin');
  11. const publicDir = path.resolve(__dirname, '../dist/tmp/public');
  12. const clientDir = path.resolve(__dirname, '../client');
  13. fs.emptyDirSync(publicDir);
  14. module.exports = merge(baseWpConfig, {
  15. mode: 'production',
  16. output: {
  17. path: `${publicDir}${baseWpConfig.output.publicPath}`,
  18. filename: 'bundle.[contenthash].js',
  19. },
  20. module: {
  21. rules: [
  22. {
  23. test: /\.css$/,
  24. use: [
  25. MiniCssExtractPlugin.loader,
  26. 'css-loader'
  27. ]
  28. }
  29. ]
  30. },
  31. optimization: {
  32. minimizer: [
  33. new TerserPlugin({
  34. parallel: true,
  35. terserOptions: {
  36. format: {
  37. comments: false,
  38. },
  39. },
  40. }),
  41. new CssMinimizerWebpackPlugin()
  42. ]
  43. },
  44. plugins: [
  45. new MiniCssExtractPlugin({
  46. filename: "[name].[contenthash].css"
  47. }),
  48. new HtmlWebpackPlugin({
  49. template: `${clientDir}/index.html.template`,
  50. filename: `${publicDir}/index.html`
  51. }),
  52. new CopyWebpackPlugin({patterns:
  53. [{context: `${clientDir}/assets`, from: `${clientDir}/assets/*`, to: `${publicDir}/` }]
  54. }),
  55. ]
  56. });