UglifyJsPlugin does not work properly when webpack compresses files

follow the video to learn about webpack packaging. The video says that webpack comes with a compression tool, UglifyJsPlugin. Webpack.config.js is configured as per the course. As follows:

var path = require("path");
var webpack = require("webpack");
var UglifyJsPlugin = webpack.optimize.UglifyJsPlugin;
module.exports = {
    entry:"./src/js/index.js",
    output:{
        filename:"bundle.js",
        path:path.resolve(__dirname,"./dist")
    },
    module:{
        rules:[{
            test:/\.css$/,
            use:["style-loader","css-loader"]
        }]
    },
    plugins:[
        new UglifyJsPlugin()
    ]
}

after installing the dependency, the error message for executing webpack, is as follows:

Error: webpack.optimize.UglifyJsPlugin has been removed, please use config.optimization.minimize instead.

literally means that you need to use minimize instead. Another problem with
is that the webpack version of this project is 4.11.1, but when viewing webpack-v locally, it is 2.6.1. It feels like there might be a problem here, too.

I would like to ask how to solve the problem. If the description is incomplete and you need other information, please leave a message.

Mar.18,2021

versions of tutorials are generally lagging behind, which is an introduction on the official website. optimization-minimize

follow the example in the tutorial, and it's best to keep the same version as it. After all, the api on the front end is the same every day.


webpack4 no longer supports the use of remove webpack.optimize.UglifyJsPlugin compression configuration. It is recommended to use the optimization.minimize attribute instead and install the latest version of the plug-in

Menu