webpack.prod.babel.dev.js 2.65 KB
"use strict";

// Important modules this config uses
var path = require('path');

var webpack = require('webpack');

var TerserPlugin = require('terser-webpack-plugin');

var CompressionPlugin = require('compression-webpack-plugin');

module.exports = require('./webpack.base.babel')({
  mode: 'production',
  // In production, we skip all hot-reloading stuff
  entry: [require.resolve('react-app-polyfill/ie11'), path.join(process.cwd(), 'src/app.js')],
  // Utilize long-term caching by adding content hashes (not compilation hashes) to compiled assets
  // output: {
  //   filename: '[name].[chunkhash].js',
  //   chunkFilename: '[name].[chunkhash].chunk.js',
  // },
  optimization: {
    minimize: true,
    minimizer: [new TerserPlugin({
      terserOptions: {
        warnings: false,
        compress: {
          comparisons: false
        },
        drop_debugger: true,
        drop_console: true,
        pure_funcs: ['console.log'],
        parse: {},
        mangle: true,
        output: {
          comments: false,
          ascii_only: true
        }
      },
      parallel: true,
      cache: true,
      sourceMap: true
    })],
    nodeEnv: 'production',
    chunkIds: 'deterministic',
    moduleIds: 'deterministic',
    usedExports: true,
    sideEffects: true,
    concatenateModules: true,
    runtimeChunk: 'single',
    splitChunks: {
      maxSize: 1000 * 1024,
      // 控制包的最大字节数
      minSize: 10 * 1024,
      // 控制包的最小字节数
      cacheGroups: {
        vendor: {
          chunks: 'all',
          minSize: 0,
          maxInitialRequests: 10,
          test: /[\\/]node_modules[\\/]/,
          name: function name(module) {
            var packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
            return "npm.".concat(packageName.replace('@', ''));
          }
        },
        bizComponent: {
          chunks: 'all',
          minSize: 0,
          maxInitialRequests: 10,
          test: /[\\/]src[\\/]components[\\/]/,
          name: 'biz-component'
        },
        react: {
          chunks: 'all',
          minSize: 0,
          maxInitialRequests: 10,
          test: /[\\/]node_modules[\\/]react-dom[\\/]/,
          name: 'react-dom'
        }
      }
    }
  },
  plugins: [new CompressionPlugin({
    algorithm: 'gzip',
    test: /\.js$|\.css$|\.html$/,
    threshold: 10240,
    minRatio: 0.8
  }) // new webpack.ids.HashedModuleIdsPlugin({
  //   hashFunction: 'sha256',
  //   hashDigest: 'hex',
  //   hashDigestLength: 20,
  // }),
  ],
  performance: {
    assetFilter: function assetFilter(assetFilename) {
      return !/(\.map$)|(^(main\.|favicon\.))/.test(assetFilename);
    }
  }
});