Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
nojvek opened this issue May 16, 2020 · 2 comments

Comments

@nojvek
Copy link

nojvek commented May 16, 2020

when webpack compiles sourcemaps, the urls look like this

webpack:///./foo/bar/some/file.js

is there a way to tell source-map-support, how to map webpack:/// files ?

@braddialpad
Copy link

I am having this exact problem as well, have tried a million things, no luck yet.

@WeslyG
Copy link

WeslyG commented Nov 8, 2021

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants