How to change `sourceMappingURL` by using webpack

Question

My production webpack configuration is:

{
  output: {
    publicPath: "https://cdn.example.com/sub-directory/",
    filename: '[name]-[chunkhash].min.js'
  },

  devtool: 'source-map',

  plugins: [
    new webpack.optimize.UglifyJsPlugin()
  ]
}

Now I have two files app-12345.min.js and app-12345.min.js.map.

I also have automatically generated CDN URL https://cdn.example.com/sub-directory/app-12345.min.js for main script.

But sourceMappingURL is still relative path //# sourceMappingURL=app-12345.min.js.map and not accessible directly in browser.

My question is how I can set sourceMappingURL as absolute automatically generated path?

Answer 1

The SourceMapDevToolPlugin plugin is an option.

new webpack.SourceMapDevToolPlugin({
    filename: '[file].map',
    append: '\n//# sourceMappingURL=' + path + '[url]'
});