Skip to content

Conversation

@marcusforsberg
Copy link

See #42.

Not passing in the entire Sanity Client actually significantly reduced the bundle size, in my case from 131kB to 102kB for First Load JS. IMO this should probably be the default recommendation.

I went ahead and removed the npm install --save @sanity/client part from the readme since it actually isn't strictly needed and many projects will probably already have it.

This PR also adds a note on how to use with Server Components in the App Router. The default example in the readme won't work in a Server Component since the loader cannot be set in a Server Component:

Unhandled Runtime Error Error: Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it with "use server"

The Image component, being a Client Component, needs to be wrapped in another Client component in order to pass a custom loader to it.

Thanks for your work on this package!

@lime
Copy link
Contributor

lime commented Nov 16, 2023

👍 to having this explained in the readme!

Now that #62 was merged, this could be simplified further into just passing the project details, without having to wrap them in a client-like:

const imageProps = useNextSanityImage({
  projectId: process.env.NEXT_PUBLIC_SANITY_PROJECT_ID,
  dataset: process.env.NEXT_PUBLIC_SANITY_DATASET
}, mySanityData.image);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants