5

I'm using babel-loader in my webpack.config.js file but I noticed it removes the license comments of the form:

/*! whatever **/

Is there a way to preserve them? I noticed babel has a commentsoptions, but I guess that would preserve any comment and not just the license ones.

const webpack = require('webpack');

module.exports = {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.js'
    }
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
          loaders: {
            scss: 'vue-style-loader!css-loader!sass-loader',
            js: 'babel-loader'
          }
        }
      },
      {
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
        }
      }
    ]
  },
  plugins: [
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false,
        drop_console: false,
      }
    })
  ],
};

I already tried:

plugins: [
    new webpack.optimize.UglifyJsPlugin({
      output:{
        comments: true
      }
})

As well as comments: '/^!/' and comments: /^!/. Nothing works.

It only keeps comments if I remove the whole plugins option from the webpack config.

I also tried using license comments such as:

/** comments */

/*! comments */

/*! @license comments */

/*! @preserve comments */
Alvaro
  • 40,778
  • 30
  • 164
  • 336

3 Answers3

3

That's a bug, that's been in webpack/uglify since 2015, and never got fixed.

They supposedly fixed it using this by rather adding extractComments to true but still it won't work for some people so a year later in 2019 another PR has been opened to supposedly fixing it.

new UglifyJSPlugin({
  sourceMap: true,
  extractComments: true
})

So it's a known bug that has been hanging around for years. Maybe hacks do exist, but that's the general case.

Alexandre Elshobokshy
  • 10,720
  • 6
  • 27
  • 57
  • 1
    adding these two options in TerserPlugin works as well and creates a seperate *filename*.js.LICENSE file with just the license comments. Cool – koral Mar 11 '20 at 15:15
0

Working hack:

const WrapperPlugin = require('wrapper-webpack-plugin');
let licenseComments = [];

module.exports = {
    ...
    optimization: {
        minimize: true,
        minimizer: [
            new UglifyJsPlugin({}),
            new WrapperPlugin({
                header: function () {
                    var unique = licenseComments.filter((v, i, a) => a.indexOf(v) === i); 
                    return unique.map(x => '/*' + x + '*/').join('\n');
                }
            })
        ],
    },
    module: {
        {
            test: /\.js$/,
            use: {
                loader: 'babel-loader',
                options: {
                    shouldPrintComment: (val) => {
                        if (/license/.test(val)) {
                            licenseComments.push(val);
                        }
                        return false;
                    },
                }
            }
        }
    ...
Andrii Muzalevskyi
  • 3,261
  • 16
  • 20
-1

Try once adding output option.

plugins : [
  new webpack.optimize.UglifyJsPlugin({
    compress: {
      warnings: false,
      drop_console: false
    },
    output: {
      comments: '/^!/'
    }
  })
]

I am not sure whether it will work or not because i have never used it. For more details refer this

Please let me know whether it works or not.

Syed
  • 269
  • 2
  • 8