webpack配置uglifyjs-webpack-plugin壓縮代理(最簡配置)

• 代碼壓縮前大小

 

•  安裝代碼壓縮插件

npm i -D uglifyjs-webpack-plugin

 

•  webpack配置

const path = require('path');
const webpack = require('webpack');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const isMiniSize = process.env.NODE_ENV === 'production' ? true : false;
module.exports = {
    entry: './src/index.js',
    output: {
        path: path.resolve('E:/' , 'ocxPluginDemo'), // 打包後的路徑
        filename: 'ocxWebCtl.min.js',
        library: 'ocxWebCtl',
        libraryTarget: 'umd'
    },
    optimization: {
        minimize: isMiniSize
    },
    node: {
      process: false
    },
    devtool: 'source-map',
    module: {
        rules: [{
            test: /.js$/,
            enforce: 'post', // post-loader處理
            loader: 'es3ify-loader'
        }, {
            test: /\.js$/,
            loader: 'babel-loader',
            options: {
                sourceMap: false,
            },
            exclude: /node_modules/
        }]
    }
}

• 另外在module.exports對象中添加,重新運行生產文件命令即可得到壓縮過後的文件

plugins:[
    	new UglifyJsPlugin()
    ]

關於uglifyjs-webpack-plugin更多配置鏈接地址：

https://www.webpackjs.com/plugins/uglifyjs-webpack-plugin/

 

•  壓縮過後文件大小