does not go to the editor when clicked about error-overlay-webpack-plugin HOT 5 CLOSED

so i actually just brought in all of react-dev-utils because its 2020 and the singularity is gonna happen soon anyway so why worry about performance or bundle size etc...

anyway, i have found what is working for me is based on a few things.

1. facebook/create-react-app#2344 (comment)
   a. first i tried what dan abramov (gaeron) says in this issue, using react-error-overlay
2. facebook/create-react-app#3097 (comment)
   a. then i got it up and running by installing the full react-dev-utils and using the suggestion of basically just replacing some strings instead of using the ones provided by abramov (gaeron) in the previous issue
   b. replace react-error-overlay with react-dev-utils/webpackHotDevClient
   c. replace react-error-overlay/middleware with react-dev-utils/errorOverlayMiddleware
3. webpack config option: output.devtoolModuleFilenameTemplate
   a. here's where this open issue comes in, basically i was finding that the link i would click in the browser would not send me to the editor as i had wished and per my investigation, i found that the url given were paths/filenames to files that obviously didn't exist
   b. i found the link above which was admittedly not super clear to me, but looked familiar with a reference to this default value
   c. 'webpack://[namespace]/[resource-path]?[loaders]'
4. https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/config/webpack.config.js#L231
   a. and here's what started opening the editor on click for me. basically i just copied the line for that webpack config key/value for dev mode and put it in my dev config and violá

'output': {
    // i added this one line to the rest of my output config in webpack.dev.config.js, which was otherwise left unchanged.
    'devtoolModuleFilenameTemplate': (info => path.resolve(info.absoluteResourcePath).replace(/\\/g, '/')),
}

so i guess what i'm trying to say is... that one config option is worth investigating as the potential solution somewhere for those who find this issue.

from error-overlay-webpack-plugin.

Did someone find a solution to this?

from error-overlay-webpack-plugin.

no

from error-overlay-webpack-plugin.

Can also do something like:

  app.use((req, res, next) => {
    // We get: 'webpack:///packages/app/src/pages/home/Home.tsx'
    if (!req.url.startsWith(launchEditorEndpoint)) return
    const fileName = req.query.fileName.replace('webpack:///', './')
    req.query.fileName = fileName
    console.log('Opening in editor:', fileName)
    errorOverlayMiddleware()(req, res, next)
  })

from error-overlay-webpack-plugin.

@vjpr maybe we could find a way to make it work by default?

from error-overlay-webpack-plugin.