Cannot find module '@sanity/client' error in React blog tutorial
The error you're seeing happens because you haven't installed the @sanity/client package yet. This is a common issue when following tutorials - the package needs to be installed before you can import it in your code.
Here's how to fix it:
Run this command in your project's root directory (the sanity-react folder, not inside mysanityblog):
npm install @sanity/clientImportant notes about the tutorial you're following:
The tutorial you're using is for an older version of Sanity (Studio v2), which is now deprecated. The current version is Studio v3. While the core concepts are similar, there are some differences you should be aware of.
For the @sanity/client package specifically:
When you install it, you'll get the latest version (v6). The import and basic usage shown in the tutorial still works, but you should include an apiVersion parameter. Update your src/client.js to look like this:
import {createClient} from '@sanity/client'
export default createClient({
projectId: "Your Project ID Here", // find this at manage.sanity.io or in your sanity.json
dataset: "production",
useCdn: true,
apiVersion: '2024-01-01', // use current date (YYYY-MM-DD) to target the latest API version
})Notice two changes from the tutorial:
- The import uses
{createClient}instead of the default import - Added the
apiVersionparameter (required in newer versions)
After installing the package, restart your React development server (stop it with Ctrl+C and run npm start again) and the error should be resolved.
Moving forward:
If you're just getting started with Sanity, I'd recommend checking out the official Sanity documentation for up-to-date examples with Studio v3, or explore the starter templates which use the current version of Sanity and will save you from having to deal with deprecated code.
Show original thread8 replies
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.