1. uglify-loader
Uglify.js loader for webpack
uglify-loader
Package: uglify-loader
Created by: bestander
Last modified: Tue, 28 Jun 2022 03:08:04 GMT
Version: 3.0.0
License: MIT
Downloads: 28,255
Repository: https://github.com/bestander/uglify-loader

Install

npm install uglify-loader
yarn add uglify-loader

uglify-loader

Uglify loader for webpack

To install

npm install uglify-loader --save-dev

Use Case

Webpack has UglifyJSPlugin that uglifies the output after bundling.
In the applications that depend on thirdparty libraries you may want to uglify with mangling only your application code but not the code that you don't control.

Example

Webpack 1

module: {
    loaders: [
        {
            // I want to uglify with mangling only app files, not thirdparty libs
            test: /.*\/app\/.*\.js$/,
            exclude: /.spec.js/, // excluding .spec files
            loader: "uglify"
        }
    ]
}

You can pass UglifyJS parameters via 'uglify-loader' property of webpack config.

module: {
    loaders: [
        {
            // I want to uglify with mangling only app files, not thirdparty libs
            test: /.*\/app\/.*\.js$/,
            exclude: /.spec.js/, // excluding .spec files
            loader: "uglify"
        }
    ]
},
'uglify-loader': {
    mangle: false
}

Webpack 2

module: {
    rules: [
        {
            // I want to uglify with mangling only app files, not thirdparty libs
            test: /.*\/app\/.*\.js$/,
            exclude: /.spec.js/, // excluding .spec files
            use: 'uglify-loader'
        }
    ]
}

You can pass UglifyJS parameters via loader options.

module: {
    rules: [
        {
            // I want to uglify with mangling only app files, not thirdparty libs
            test: /.*\/app\/.*\.js$/,
            exclude: /.spec.js/, // excluding .spec files
            use: {
                loader: 'uglify-loader',
                options: {
                    mangle: false
                }
            }
        }
    ]
}

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin