Is it possible to add custom prefixes to system environment variables?

[acrobertson]

I have a Sanity Studio app hosted on Vercel. (It's in a monorepo with a Next.js app.)

I want to use the VERCEL_URL system environment variable in the project, but Sanity requires all environment variables to be prefixed with SANITY_STUDIO_.

As far as I can tell, the only way to add prefixes to the system variables is to use a framework preset, but there isn't one for Sanity.

Is there another way to make these variables work in my project?

I've read through the docs and couldn't find a way to add a custom prefix to the system variables to map the variables to new ones.

I tried this approach suggested in an SO comment of mapping VERCEL_URL to SANITY_STUDIO_VERCEL_URL in a .env.production file, but the variable was empty in the build.

[samcx]

@acrobertson Curious, have you tried adding the process.env part here → SANITY_STUDIO_VERCEL_GIT_COMMIT_REF=${process.env.VERCEL_GIT_COMMIT}. If this doesn't work, you can use a next.config.js file → https://github.com/vercel/next.js/blob/canary/examples/with-env-from-next-config-js/next.config.js (we don't recommend this method over the Environment Variables UI unless necessary).

[acrobertson]

@samsisle Unfortunately neither of these worked for me.

I updated my .env.preview and .env.production files to

SANITY_STUDIO_VERCEL_ENV=${process.env.VERCEL_ENV}
SANITY_STUDIO_VERCEL_URL=${process.env.VERCEL_URL}

but both values still came in empty.

And the next.config.js approach actually isn't an option because this isn't a Next.js project. (Apologies if my comment about the monorepo was confusing.) If it were, I could just use the NEXT_PUBLIC_-prefixed system variables provided by the framework preset and wouldn't have this problem.

It seems like there should be a way to add custom prefixes for frameworks without predefined presets. If that's not currently possible, please let me know if there's a proper place to request that feature.

[acrobertson]

For anyone else with a similar problem, here's what I did get working.

I added a prebuild script to my package.json:

{
  "prebuild": "cross-env NODE_ENV=production node ./scripts/prebuild.js"
}

and I added a Node script in scripts/prebuild.js that maps all the Vercel system variables to prefixed ones and writes them to a .env file for the active environment.

import { writeFile } from 'fs';

const activeEnv = process.env.SANITY_ACTIVE_ENV || null;
const isVercel = process.env.VERCEL === '1' || false;

if (activeEnv == null || !isVercel) {
	console.log('Skipping prebuild');
	process.exit(0);
}

// Prefix all Vercel system variables with SANITY_STUDIO
// to make them accessible in the project
const mappedVars = Object.entries(process.env)
	.filter(([key]) => key.startsWith('VERCEL'))
	.map(([key, val]) => `SANITY_STUDIO_${key}=${val}`);

// Write the mapped variables to a .env file for the active environment
const envFile = `.env.${activeEnv}`;
writeFile(`.env.${activeEnv}`, mappedVars.join('\n'), (err) => {
	if (err) {
		console.error(err);
		process.exit(1);
	}
	console.log(`Wrote ${envFile}`);
});