cld2_react/config/webpack.prod.config.js

const merge = require('webpack-merge');
const common = require('./webpack.common.config.js');

const path = require('path');

const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');

module.exports = merge(common, {

  module: {
    rules: [
      {
        test: /\.css$/,
        use: [ 
          MiniCssExtractPlugin.loader,
          'css-loader' 
        ]
      },
      {
        test: /\.less$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader',
          'less-loader'
        ]
      },
      {
        test: /\.(sass|scss)$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader',
          'sass-loader'
        ]
      },

    ]
  },

    optimization: {
      minimizer: [
        //new UglifyJsPlugin(),
        new OptimizeCssAssetsPlugin({
          assetNameRegExp:/\.css$/g,
          cssProcessor:require("cssnano"),
          cssProcessorPluginOptions:{
            preset:['default', { discardComments: { removeAll:true } }]
          },
          canPrint:true
        })
  
      ],
        splitChunks: {
          chunks: 'all',
          minSize: 30000,
          maxSize: 0,
          minChunks: 1,
          cacheGroups: {
            framework: {
              test: "framework",
              name: "framework",
              enforce: true
            },
            vendors: {
              priority: -10,
              test: /node_modules/,
              name: "vendor",
              enforce: true,
            },
          }
        }
      },


  mode: 'production',
  output: {
    filename: 'nodejs/[name].[hash].bundle.js',
  },
  mode: 'development',
  devServer: {
    host:'127.0.0.1',
    allowedHosts: [
      'cld2.com'
  ],
    contentBase: path.resolve(__dirname, '../dist'),
    open: true,
    port: 9090,
    compress: true,
    hot: true,
    historyApiFallback: {
      rewrites: [
        { 
          from: /^\/company/, to: '/',
          from: /^\/product\/lockStatistics/, to: '/product',
          from: /^\/product/, to: '/product',
          //客户相关
          from: /^\/contact/, to: '/contact',
          from: /^\/contact\/company/, to: '/contact',
        },
      ]
    }
  },
  plugins: [
    new HtmlWebpackPlugin({
      filename: 'index.html',
      template: 'public/index.html',
      chunks:['workbench','framework'],
      // inject: 'body',
      // minify: {
      //   removeComments: true,
      //   collapseWhitespace: true,
      // },
    }),
    new MiniCssExtractPlugin({
      filename: 'nodecss/[name].[hash].css',
      chunkFilename: 'css/[id].[hash].css',
    }),
    //new CleanWebpackPlugin(),
  ]
});