🚨Claude Code source code got leaked because of this source map🚨 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. This is not an issue with the 𝗰𝗿𝗲𝗮𝘁𝗲-𝗿𝗲𝗮𝗰𝘁-𝗮𝗽𝗽 but All of the source code is added because of the source map which helps to easily identify the source of the bug that will occur on the live site in the future. This is fine If the website source code is publicly available on GitHub. 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. 𝗙𝗼𝗿 𝗺𝗼𝗿𝗲 𝘀𝘂𝗰𝗵 𝘂𝘀𝗲𝗳𝘂𝗹 𝗰𝗼𝗻𝘁𝗲𝗻𝘁, 𝗱𝗼𝗻'𝘁 𝗳𝗼𝗿𝗴𝗲𝘁 𝘁𝗼 𝗳𝗼𝗹𝗹𝗼𝘄 𝗺𝗲. 𝗣𝗦: If you're using Vite for creating your React application, you don't need to do anything as sourcemaps are not exposed by default. 🔥𝗗𝗼𝗻'𝘁 𝗳𝗼𝗿𝗴𝗲𝘁 𝘁𝗼 𝗷𝗼𝗶𝗻 𝗮𝘁 𝟰 𝗣𝗠 𝗜𝗦𝗧 𝘁𝗼𝗱𝗮𝘆 𝗳𝗼𝗿 𝗮 𝟯+ 𝗵𝗼𝘂𝗿𝘀 𝗹𝗶𝘃𝗲 𝘄𝗲𝗯𝗶𝗻𝗮𝗿 𝗼𝗻 𝗛𝗼𝘄 𝘁𝗼 𝗕𝘂𝗶𝗹𝗱 𝗮 𝗥𝗲𝘀𝘁𝗮𝘂𝗿𝗮𝗻𝘁 𝗢𝗿𝗱𝗲𝗿𝗶𝗻𝗴 𝗔𝗽𝗽 𝗶𝗻 𝗵𝗼𝘂𝗿𝘀 𝗶𝗻𝘀𝘁𝗲𝗮𝗱 𝗼𝗳 𝗱𝗮𝘆𝘀/𝗺𝗼𝗻𝘁𝗵𝘀. Link to register for the webinar is 𝗶𝗻 𝘁𝗵𝗲 𝗰𝗼𝗺𝗺𝗲𝗻𝘁 𝗮𝗻𝗱 𝗶𝗻 𝘁𝗵𝗲 𝗳𝗲𝗮𝘁𝘂𝗿𝗲𝗱 𝘀𝗲𝗰𝘁𝗶𝗼𝗻 𝗼𝗳 𝗺𝘆 𝗟𝗶𝗻𝗸𝗲𝗱𝗜𝗻 𝗽𝗿𝗼𝗳𝗶𝗹𝗲. #javascript #reactjs #nextjs #webdevelopment
Great post
Disabling sourcemaps with 𝗚𝗘𝗡𝗘𝗥𝗔𝗧𝗘𝗦𝗢𝗨𝗥𝗖𝗘𝗠𝗔𝗣=𝗳𝗮𝗹𝘀𝗲 is a quick fix, but in pentesting I've observed that exposed maps often reveal the exact file structure and vulnerable libraries, so adding a strict Content Security Policy can further mitigate the risk. Have you also considered stripping sourcemaps in your CI/CD pipeline to avoid accidental commits?