webpack 4.2 – how can I obtain the original source file name and line line number, where the error was thrown?
Asked Answered
C

0

1

By default Webpack 4 is using UglifyJS for minifying the code.

In the production I am getting an unusable error message point to the column of the compiled javascript file.

The documentation

https://webpack.js.org/guides/migrating/#uglifyjsplugin-sourcemap

claims that one should be able to obtain the correct line by setting sourceMap to true in the UglifyJS Plugin. I've tried it, but that's not working.

Here's the respective webpack config file:

const webpack = require('webpack');
const CompressionPlugin = require('compression-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const webpackMerge = require('webpack-merge');
const ssrClientConfig = require('./wp4-ssr-client-config');
const SWPrecachePlugin = require('sw-precache-webpack-plugin');

module.exports = webpackMerge(ssrClientConfig, {
  mode: 'production',
  // entry is set in ssrClientConfig 
  output: {
    filename: '[name]-[hash:8].js'//,
  },
  devtool: 'source-map',
  plugins: [
    // trying to get a proper source map according to
    // https://webpack.js.org/guides/migrating/#uglifyjsplugin-sourcemap 
    new UglifyJsPlugin({
      sourceMap: true, 
    }),

    // setting for Vue according to:
    // https://v2.vuejs.org/v2/guide/deployment.html
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': '"production"',
      'process.env.VUE_ENV': '"client"'
    }),
   
    new SWPrecachePlugin({
      cacheId: 'vue-hn',
      filename: 'service-worker.js',
      minify: true,
      dontCacheBustUrlsMatching: /./,
      staticFileGlobsIgnorePatterns: [
        /\.map$/, /\.json$/
      ]
    })  
  ]
});
Courtyard answered 25/3, 2018 at 15:3 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.