Module not found errors for @sanity/ packages in Storybook example project

17 replies
Last updated: May 8, 2021
Hi, I'm trying to run the Storybook project from the Sanity examples directory (https://github.com/sanity-io/sanity/tree/next/examples/storybook ). After installing all dependencies (tried
lerna bootstrap
and
npm
as well as
yarn
), and starting the server, I get many Module not found: Error: Can't resolve
@sanity/
related errors - at least 32 of them - even if the dependencies seem to be installed correctly.
AI Update

The Sanity repository examples are designed to work within the monorepo context using pnpm workspaces, not as standalone projects. The examples/storybook directory you're trying to run depends on internal workspace references to other packages in the monorepo, which is why you're seeing all those @sanity/ module resolution errors.

Here's what's happening: The example expects to resolve @sanity/* packages from the monorepo's internal workspace packages (like @sanity/ui, @sanity/icons, etc.), not from npm. When you try to run it in isolation with npm, yarn, or even lerna bootstrap, these workspace dependencies can't be resolved correctly because the workspace structure isn't set up properly.

To run the Storybook example properly:

  1. Clone the entire Sanity repository (if you haven't already):

    git clone https://github.com/sanity-io/sanity.git
    cd sanity
  2. Switch to the next branch (since that's where you found the example):

    git checkout next
  3. Install pnpm if you don't have it:

    npm install -g pnpm
  4. Install all dependencies from the root of the monorepo:

    pnpm install
  5. Build the monorepo packages that the Storybook example depends on:

    pnpm build
  6. Navigate to the Storybook example and run it:

    cd examples/storybook
    pnpm dev

The key insight is that Sanity's monorepo uses pnpm workspaces, and the examples are meant to demonstrate usage patterns for contributors or those exploring the Sanity codebase, not necessarily as copy-paste starter templates.

If you're looking to use Sanity with Storybook in your own project, you'd want to install the published npm packages (@sanity/ui, @sanity/icons, etc.) directly in your project rather than trying to extract the example. You can use the example code as a reference for how to configure stories and components, but start with a fresh project and install the Sanity packages you need from npm using npm install @sanity/ui or similar.

The examples folder in the Sanity repository is primarily for internal development and demonstration purposes within the monorepo structure.

Show original thread
17 replies
After running
lerna bootstrap
from the root of the repo, I try to start the app, but get this error:
storybook % npm start            

> storybook@2.10.2 start
> sanity start --port 9002

@sanity/core not installed in current project
Project-specific commands not available until you run `sanity install`

Error: "start" is not available outside of a Sanity project context.
Run the command again within a Sanity project directory, where "@sanity/core"
is installed as a dependency.

Even though
node_modules/@sanity/core
is installed - I can see it being there. I continue as suggested above:
storybook % sanity install
✖ Resolving dependencies Fetching packages
✖ An unexpected error occurred: "ENOENT: no such file or directory, lstat '/Users/fabien/Development/sanity/sanity-development/examples/storybook/node_modules/@sanity/base/node_modules/polished/node_modules'".
✖ Resolving dependenciesinking dependencies

Error: Command failed :(
Proceeding with
npm i
and running
sanity install
once again, I can finally start the server:
⠦ Compiling...Storybook listening on <http://localhost:9001/>
⠙ Compiling...webpack built d1935283b7fceb260a1a in 7327ms
✔ Compiling...
Failed to compile.
Followed by numerous
Module not found: Error: Can't resolve ...
errors.
I got this working with
yarn
followed by
sanity start
. Perhaps give that a try with a clean version of the directory?
Hi Geoff, did you run
lerna bootstrap
first?
No. I don’t have lerna installed globally and don’t see it anywhere in the package.
Unfortunately, no success. I deleted
node_modules
and
package-lock.json
and
yarn.lock
.
What’s the latest error now? Is it when running
yarn
or
sanity start
?
What’s the latest error now? Is it when running
yarn
or
sanity start
?
Still all the compilation errors due to missing dependencies (so after
sanity start
)
Still all the compilation errors due to missing dependencies (so after
sanity start
)
Sorry Fabien. I tried different versions of node and yarn and couldn’t replicate the error.
That's odd - thanks for checking this. I'm on Node
v14.15.0
. Did you simply clone the full repo and go to that directory and ran
yarn
?
I tried on 14.16.1, 15.12.0, and 16.1.0. I downloaded the whole sanity repo then pulled out the storybook folder and worked on it in isolation.
Let me try that in isolation - I have a feeling that this lerna thing is still causing havoc here.
Sure enough, it's now working (pulled it from a zip file of the repo). Thanks for all your help!
Nice! Glad to hear it.

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.

Was this answer helpful?