If you are building a Product using React & using create-react-app boilerplate to get started.
I have seen this mistake doing by many of the Startups i got offer for different roles and by some great products.
Here's One Thing you need to change. That, Source Code that is written by you or the developer team should not be visible to the client.
And, To Hide Your Source Code in Developer Tools, just update this one line in your package.json
file.
"build": "GENERATE_SOURCEMAP=false react-scripts build"
Before Adding that Line:
After Adding that Line:
Some More Modern Frameworks Like next.js have fixed this issue in their boilerplates.
Live Demo: https://dont-use-default-boilerplate.vercel.app/
Source Code on GitHub: https://github.com/Siddhant-K-code/dont-use-default-boilerplate
Top comments (3)
Source maps are essential for debugging in the event of error reports. The mistake is actually not in generating them but to publish them to production server. Take for e.g., docs.sentry.io/platforms/javascrip... Sentry support demangling of symbols using sourcemaps generated during build.
Yeah, I had the same point that mistake is to take sourcemaps to Prod. That's why I added the
sourcemap false
script to to thebuild script
and not to thedevelopment script
There's is nothing wrong in building it in production. You ideally should build it, you can't use development sourcemaps to trace errors in production builds. The key is to exclude them from the publishing part.