32
React source code visible ๐ฒ
Do you know that when you deploy your React application which is created using ๐ฐ๐ฟ๐ฒ๐ฎ๐๐ฒ-๐ฟ๐ฒ๐ฎ๐ฐ๐-๐ฎ๐ฝ๐ฝ or your own webpack configuration to a live website like Netlify, Vercel, Heroku etc, your entire source code is visible to everyone from the sources tab of the developer toolbar as shown in the screenshot of this post.
![](https://res.cloudinary.com/practicaldev/image/fetch/s--W5nzR6xw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n3xhm6q97ld17hmc72zg.jpg)
This is not an issue with the ๐ฐ๐ฟ๐ฒ๐ฎ๐๐ฒ-๐ฟ๐ฒ๐ฎ๐ฐ๐-๐ฎ๐ฝ๐ฝ but all of the source code is added because of the source map
๐ฒ๐ฒ๐ฒ
But you definitely don't want everyone to see your entire source code If it's a private repository or you're working on a client project.
There is an easy way to fix it.
Create a file with the name .env in your project folder with the below code inside it
GENERATE_SOURCEMAP=false
so when you run ๐ป๐ฝ๐บ ๐ฟ๐๐ป ๐ฏ๐๐ถ๐น๐ฑ or ๐๐ฎ๐ฟ๐ป ๐ฟ๐๐ป ๐ฏ๐๐ถ๐น๐ฑ command from the terminal,
It will generate a ๐ฏ๐๐ถ๐น๐ฑ folder with minified files without a source map that you can deploy to the production.
Connect with me for more tech related information Twitter
32