0

How can I set up @sanity/client on both vercel and a local development? Right now we have it set up on vercel, but I would like to do some local development on the site, but I don't know how to set up the environment variables on my local machine.

This is how the code looks right now on our site. This is the code for @sanity/client:

import sanityClient from "@sanity/client";
import { config } from "@/utils/config";

const client = sanityClient({
  projectId: config.sanityProjectId,
  dataset: config.sanityProjectDataset,
  token: config.sanityProjectToken, 
  useCdn: false, 
  ignoreBrowserTokenWarning: true,
});

export default client;

And here is the relevant code from the config file:

import getConfig from "next/config";

// Only holds serverRuntimeConfig and publicRuntimeConfig
const { publicRuntimeConfig } = getConfig();

export const config = {
  sanityProjectId: publicRuntimeConfig?.sanityProjectId,
  sanityProjectDataset: publicRuntimeConfig?.sanityProjectDataset,
  sanityProjectToken: publicRuntimeConfig?.sanityProjectToken,
};

Any idea how I can set this up so that it will work also on my local computer?

Moshe
  • 6,011
  • 16
  • 60
  • 112

1 Answers1

0

To use enviroment variables on your local enviroment, you can create for example a .env.development file on your project root and add the variables there.

For example:

SANITY_STUDIO_MYVAR=d23r-ew23e-f2dw-23ec

Any other environment variables that are prefixed with SANITY_STUDIO_ will be available inside the javascript bundle and can be accessed from code as process.env.SANITY_STUDIO_YOUR_ENV_VAR

Take a look at this section of the documentation, i think is really usefull. Let me know if this works for you!

needless to say, don't commit that file

https://www.sanity.io/docs/studio-environment-variables

Slico
  • 436
  • 2
  • 16