Hi,
We are facing issue with jsSourcemaps in gulp.config.js following are the settings:
{
"config": {
"debug": true,
"compile": {
"jsMinify": true,
"cssMinify": true,
"jsSourcemaps": true,
"cssSourcemaps": true
},
"dist": [
"../../../public/redc-admin-ui/assets"
]
}
}
cssSourcemaps just working fine and chromes dev tool showing and debugging actual SCSS file and line number.
But the issue is with jsSourcemaps this settings create external source map files which showing in last comment of scripts.bundle.js like //# sourceMappingURL=scripts.bundle.js.map and I have verified that source map file also exists. But Chrome dev tool showing error 'Uncaught ReferenceError: SmoothScroll is not defined in scripts.bundle.js:6760 where as actual error is inside demo1/src/js/layout/app.js line number 417
I'm confused why chrome inspect showing scripts.bundle.js it should show actual file app.js and the line number.
Kindly let me know if I'm missing something or guide me in right direction.
Thanks!
Faisal Rehman
It seems that the problem is that Chrome DevTools is not showing the actual source file you are working on, but instead showing the scripts.bundle.js file after it has been bundled. This often happens when source maps are not configured correctly. You can double check your source map configuration in your build tool (like Webpack) to make sure everything is being generated correctly. Adding Sprunki Retake to your debugging process would definitely make testing your code easier and more enjoyable!
Hi Faisal,
Probably, this is a Chrome issue. Please verify that your Chrome browser can read the source map files. Please check the link below to set up.
https://stackoverflow.com/a/60274056
Thanks