How to interpret Chrome console debug data?

Question

I'd like to know the line, but I don't even know the file. I'm running Webpack / React in developer mode and I can verify this by the reddish debug icon in Chrome as I have the React Dev Tools installed.

I get this error:

Uncaught Error: Module build failed: Error: ENOENT: no such file or directory, 

open '/Users/foo/root/repo_fave/client-react/src/components/CAddModal.jsx'
        at eval (webpack-internal:///133:1)
        at Object.<anonymous> (bundle.js:1624)
        at __webpack_require__ (bundle.js:20)
        at Object.eval (F1.jsx?edf4:9)
        at eval (125:106)
        at Object.<anonymous> (bundle.js:1553)
        at __webpack_require__ (bundle.js:20)
        at eval (index.jsx?f769:10)
        at Object.<anonymous> (bundle.js:1902)
        at __webpack_require__ (bundle.js:20)

Somewhere in my code base I am trying to open a file CAddModal.jsx but it does not exist. But where exactly?

I see many references to the webpack output file bundle.js, but this does me little good.

You'll need to enable [source mapping](https://stackoverflow.com/questions/30870830/how-do-i-generate-sourcemaps-when-using-babel-and-webpack) in your webpack configuration. — BalmySoftware, May 03 '18 at 20:34

score 0 · Answer 1 · answered May 06 '18 at 18:10

0

Per the comments you will need to enable source mapping for webpack. Webpack has extensive documentation on the devtool parameter here.

After enabling source mapping you should have a .map file emitted.

answered May 06 '18 at 18:10

rebecca kan

1
2

How to interpret Chrome console debug data?

1 Answers1