DEV Community

loading...

React obfuscate: Hiding source code from developer tools

hmintoh profile image hmintoh ・1 min read

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

Discussion (0)

pic
Editor guide