CODEWITHSUNDEEP
javascriptnext.jssanity
Iram
Iram

Reputation: 1

Unhandled Runtime Error Error: Configuration must contain `projectId`

I'm getting this error again and again. I've provided projectID as well via env file, still getting I'm new to NextJS and sanity as well, your help will be appreciated.

import sanityClient from '@sanity/client';
import imageUrlBuilder from '@sanity/image-url';

export const client = sanityClient({
  projectId: process.env.NEXT_APP_PROJECT_ID,
  dataset: 'production',
  apiVersion: '2022-03-10',
  useCdn: true,
  token: process.env.NEXT_APP_SANITY_TOKEN
});

const builder = imageUrlBuilder(client);

export const urlFor = (source) => builder.image(source);

I'm following a tutorial on NextJS tutorial on youtube. I was expecting it to be run smoothly, but didn't work.

Upvotes: 0

Views: 413

Answers (1)

barisdevjs
barisdevjs

Reputation: 69

So I have the same issue with you. So make sure your enviroment variables starts with VITE in case you are using VITE

In my case , I did with this way

import  SanityClient  from "@sanity/client"
import imageUrlBuilder  from "@sanity/image-url";

// take these from sanity manage

export const client = new SanityClient({
    projectId:import.meta.env.VITE_REACT_APP_SANITY_PROJECT_ID,
    dataset:'production',
    apiVersion:'2023-01-10',
    useCdn:true,
    token:import.meta.env.VITE_REACT_APP_SANITY_TOKEN,
})

const builder =  imageUrlBuilder(client);
export const urlFor = (source : any) => builder.image(source);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

And my .env file is like this

VITE_REACT_APP_SANITY_PROJECT_ID = aweqfrstbsrgvsrtbvr 
VITE_REACT_APP_SANITY_TOKEN = skm29cF1q1VsOgKIFty8D53j2dJKly9Fa..........

Make sure give a space in env file before and after the = sign

Upvotes: 0

Related Questions