Your React Codes Might Not Be In Safe!

If you are using create-react-app for creating react applications and using yarn build to get build, your react codes might not be safe.

Because, if you run yarn build command without any spesification, it will generating source maps as well.

And if you put builded files without deleting source maps to your server, anyone can see your entire react project codes.

PS: I know everybody can see your JS files, but there is difference between them. Without source map, they can see compiled version, and even if ​they try to beautify them they can't understand what did you do exactly. But if you left source map files, they can see whole project like you see while development process.

How bad is it?

If you go this website, https://svgeditoronline.com/editor/ and open developer tools, and select "Sources" tab. Then you will able to see all project codes sadly.

What we have to do?

We have to delete .map files from builded files which is in build/static/js folder.

And for the next build you should change your package.json build command

find this line

...
"build": "react-scripts build",
...

change with this

...
"build": "GENERATE_SOURCEMAP=false react-scripts build",
...

Now, your code is safe. This is a small but important think.

I checked a lot of live react project, also checked selling react scripts on codecanyon, and guess what I found? Almost every project left .map files in static/js folder.

TL;DR

  • Delete all your .map files from build/static/js folder.
  • Change your build command on package.json from this "build": "react-scripts build", to this "build": "GENERATE_SOURCEMAP=false react-scripts build", for your next builds.
  • Now you are safe, I hope :)

14