minifiy bundels

يمكن استعمال الإضافة uglifyjs-webpack-plugin و التي يمكن استعمالها بالشكل التالي:

const webpack = require("webpack");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
  // ...
  optimization: {
    minimize: true,
    minimizer: [new UglifyJsPlugin({
      include: /\.min\.js$/
    })]
  }
};

حيث هنا قمنا بتضمين الإضافة الخاصة بالعملية التي نريدها، ثم قمنا بإضافة خيارات التحسين و التي هي هنا أننا نريد عمل minimize و ذلك باستعمال الإضافة التي قمنا بتضمينها.

من أجل ال css يمكن استعمال شيء مشابه كما يلي:

const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
module.exports = {
  module: {
    ...
  },
  optimization: {
    minimizer: [
      new CssMinimizerPlugin(),
    ],
  },
};

و يمكن دمج الطريقتين كما يلي:

const webpack = require("webpack");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");


module.exports = {
  // ...
  optimization: {
    minimize: true,
    minimizer: [
      new UglifyJsPlugin({ include: /\.min\.js$/}),
      new CssMinimizerPlugin()
    ]
  }
};