Source Map not loaded

[middiu]

Hi Guys,

for some reason when I launch the example app and then I try to debug my library the source-map and then all the library src files are not loaded in the browser and not even if I try to debug using VisualSudio Code.

Because the React Hooks issue I'm using react-app-rewired customize-cra.

This is my VSC launch.json file:

"version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "https://localhost:3000",
            "webRoot": "${workspaceRoot}/src",
            "sourceMapPathOverrides": {
              "webpack:///src/*": "${webRoot}/*"
            }
        }
    ]

this is the example app package.json file, and in particular the scrips section:

  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  },

this is the example app config-overrides.js file used for react-app-rewired where you can see I add an module alias for React:

const { override, addWebpackModuleRule, addWebpackAlias,overrideDevServer } = require('customize-cra');

const path = require('path'); 
const fs = require('fs');

const devServerConfig = () => config => {
    return {
        ...config,
        https : {
            key: fs.readFileSync(process.env.REACT_HTTPS_KEY, 'utf8'),
            cert: fs.readFileSync(process.env.REACT_HTTPS_CERT, 'utf8'),
          },
    }
}

module.exports = { 
    webpack: override( 
        addWebpackAlias({
            "react": path.resolve('../node_modules/react'),
            "react-dom": path.resolve('../node_modules/react-dom')
        })
    ),
    devServer: overrideDevServer(
        devServerConfig()
    )
}

in the library dist folder I see the .js.map files, so I would say they are generate correctly.

When I try to debug in VSC and I try to set a breakpoint I get this:

i fact if I look at the Loaded Scripts section in VSC I see only one file:

when I try to open the tsx files from browser dev tools I don't see them:

I also found this way to add the source map of a library for create-react-app but I can't get it working.
facebook/create-react-app#8071 (comment)

Any help is more then welcome!

Thanks

[middiu]

One more thing: I just created a brand new module using create-react-library without changing any configuration and the module source map is loaded.

any help would be appreciated

[middiu]

I noticed something else, even if in the dist/ folder the js files generated have
//# sourceMappingURL=index.js.map

when I open the same file in the Chrome Dev Tools that line is not there... and this is why I guess the sourcemap is not loaded.... Am I correct?

Am I doing something wrong?

[transitive-bullshit]

Hey, sorry I never got back to you on this. v3 just switched to using https://github.com/developit/microbundle and may be helpful to you.