DEV Community

hmintoh
hmintoh

Posted on

 

React obfuscate: Hiding source code from developer tools

When you run yarn build in a create-react-app application, React minifies the code during the build and generates source maps. JS code thus becomes obfuscated as a byproduct of minification.

If you take a look inside build/static/js, you will see that with each .js file, there is an accompanying .js.map file. The JS files are loaded with your website, and the .map sourcemap files are loaded on demand, when developer tools are opened, so that you are able to navigate around the original code.

To disable sourcemap generation, run your build with GENERATE_SOURCEMAP=false. This will ensure that .map files will not end up in the bundled build.

"scripts": {
    "build": "GENERATE_SOURCEMAP=false react-scripts build"
}  

learned

Top comments (0)

Super Useful CSS Resources

A collection of 70 hand-picked, web-based tools which are actually useful.
Each will generate pure CSS without the need for JS or any external libraries.