Change Sanity basePath with environment variables for Netlify deployment

The 404 errors you're seeing on Netlify are a common issue with Single Page Applications (SPAs) like Sanity Studio. The good news is there's a straightforward fix!

The Main Issue: Missing Redirect Rules

Sanity Studio is a SPA, which means all routing happens client-side. When you navigate to /desk or any other route, Netlify tries to find an actual file at that path and returns a 404 when it doesn't exist. You need to tell Netlify to serve your index.html for all routes.

Create a netlify.toml file in your Studio directory with this redirect rule:

[[redirects]]
  from = "/*"
  to = "/"
  status = 200

This ensures all routes are handled by your Studio's client-side router.

About the SANITY_STUDIO_BASEPATH Environment Variable

Yes, there is a reserved environment variable called SANITY_STUDIO_BASEPATH that can override the basePath setting in your Studio configuration. However, you likely don't need this unless your Studio is deployed to a subdirectory of your domain (like mysite.com/studio).

According to the official Sanity documentation, SANITY_STUDIO_BASEPATH "Sets the base path for the studio."

If you do need to use it:

• Set it to just the path portion: /studio
• Not the full URL like https://sanity.mysite.com/

For most Netlify deployments where the Studio is at the root of the domain, you don't need to set this variable at all.

Critical Deployment Step

If your Studio is in a subdirectory (like in a monorepo setup), make sure your netlify.toml file gets copied to your build output directory:

sanity build && cp studio/netlify.toml studio/dist

The netlify.toml file must be in your build output directory (typically dist) for Netlify to recognize it. This is a common gotcha - having the file in your source code isn't enough.

Quick Troubleshooting Checklist

1. ✅ Create netlify.toml with the redirect rule in your Studio directory
2. ✅ Ensure it's copied to your build output during deployment
3. ✅ Only use SANITY_STUDIO_BASEPATH if deploying to a subdirectory path
4. ✅ If using the variable, set it to the path only (like /studio), not a full URL

The redirect rule is the key piece that makes client-side routing work on Netlify. Once that's in place, your navigation should work smoothly!