I'm deploying a Next.js app in Vercel with Sentry configuration provided by @sentry/next.js
module. Here is the example repo - https://github.com/voronianski/test-next-sentry-app
It uses the official example from Next.js (e.g. https://github.com/vercel/next.js/tree/canary/examples/with-sentry).
Integration with Sentry works perfectly. However I noticed one thing that kind of bothers me. Source maps for each file are publicly available.
Here is the link to the app - https://test-next-sentry-app.vercel.app/ and here is the map file of _app.js https://test-next-sentry-app.vercel.app/_next/static/chunks/pages/_app-b2c4ce59f737104d4ac1.js.map
This leads to the completely visible project structure and source codes in the browser dev tools -
I tried to use .vercelignore
file but it didn't help - https://github.com/voronianski/test-next-sentry-app/blob/main/.vercelignore
Is there a way to not deploy source map files to public in Vercel? Thanks!
As suggested by Vercel support - you can use rewrites
option in next.config.js
to achieve this -
const nextConfig = {
// ...
rewrites: async () => {
// do not leak source-maps in Vercel production deployments
// but keep them in Vercel preview deployments with generated urls
// for better dev experience
const isVercelProdDeploy = process.env.VERCEL_ENV === 'production';
if (isVercelProdDeploy) {
return {
beforeFiles: [
{
source: '/:path*.map',
destination: '/404'
}
]
};
}
return [];
},
// ...
};
module.exports = nextConfig;
https://nextjs.org/docs/api-reference/next.config.js/rewrites