doesn't handle webpack:/// urls well, is there a way to map webpack:/// to a path? #278

Activity

1. braddialpad commented on Aug 3, 2021

   

   braddialpad

   on Aug 3, 2021

   More actions

   I am having this exact problem as well, have tried a million things, no luck yet.
2. WeslyG commented on Nov 8, 2021

   

   WeslyG

   on Nov 8, 2021

   Last edited by WeslyG

   More actions

   Hi, 15 people is a lot for this task to remain unsolved, so I decided to dig deeper.

   The first thing I did was set the --enable-source-maps flag when running the compiled js file.
   the problem with webpack:/// persisted
   I found a wonderful guide on the web, by sourcemap in nodejs, which dealt with most of the problems.
   https://www.freecodecamp.org/news/how-to-solve-webpack-problems-the-practical-case-79fb676417f4/

   In the end, I solved this for myself with the following configuration in webpack

     ......
     mode: 'development',
     devtool: 'source-map',
     entry: ['./main.ts'],
     target: 'node',
     ......
     plugins: [
       new NodemonPlugin({
         nodeArgs: ['--inspect', '--nolazy', '--enable-source-maps'],
       }),
     ],
     output: {
       path: path.resolve(__dirname, 'dist'),
       devtoolModuleFilenameTemplate: (info) => {
         return `file:///${encodeURI(info.absoluteResourcePath)}`;
       },
       filename: 'bundle.dev.js',
     },
   

   I run the backend using the nodemon plugin, and passed it the enable-source-map flag so that nodejs reads the generated webpack maps. Now stacktrace will be displayed correctly, but it will contain the webpack:/// path.
   To avoid this, I changed the output part of the configuration webpack.config.js
   By creating a Callback function in the parameter devtoolModuleFilenameTemplate, and I return a string like files:///full/path/to/file I am using nodejs 16 lts so --enable-source-map works well, this flag appeared in node js 12

   Surprisingly, now stack trace and debug (in vs code) work fine, with a path that does not contain webpack:///
   Now I don't need node-source-map-support plugin, and I can completely abandon its use, leaving only node js native source map.

   👍React with 👍1Reacted by yoni_zana