Warning and error messages after running sanity start, resolved by performing npm i.

2 replies

Last updated: Apr 8, 2021

Hello. After I did sanity upgrade, I'm getting the following warning on running sanity start:

Warning in ./node_modules/@sanity/ui/dist/es/utils/layer/layerProvider.js
11:30-43 "export 'useMediaIndex' was not found in 
'../../hooks'
 @ ./node_modules/@sanity/ui/dist/es/utils/layer/layerProvider.js
 @ ./node_modules/@sanity/ui/dist/es/utils/layer/index.js
 @ ./node_modules/@sanity/ui/dist/es/utils/index.js
 @ ./node_modules/@sanity/ui/dist/es/index.js     
 @ ./node_modules/@sanity/base/lib/components/SanityRoot.js (part:@sanity/base/sanity-root)
 @ ./node_modules/@sanity/server/lib/browser/entry-dev.js
 @ multi ./node_modules/normalize.css/normalize.css ./node_modules/@sanity/server/lib/browser/entry-dev.js

It still starts the studip, but crashes again when trying to open in the browser.

Console shows the following error:

Uncaught TypeError: Object(...) is not a function
    at LayerProvider (layerProvider.js:11)
    at renderWithHooks (react-dom.development.js:14804)
    at mountIndeterminateComponent (react-dom.development.js:17483)
    at beginWork (react-dom.development.js:18597)
    at HTMLUnknownElement.callCallback (react-dom.development.js:189)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:238)
    at invokeGuardedCallback (react-dom.development.js:293)
    at beginWork$1 (react-dom.development.js:23204)
    at performUnitOfWork (react-dom.development.js:22155)
    at workLoopSync (react-dom.development.js:22131)

react-dom.development.js:19528 The above error occurred in the <LayerProvider> component:
    in LayerProvider (created by AppProvider)
    in PortalProvider (created by AppProvider)
    in UserColorManagerProvider (created by AppProvider)
    in AppProvider (created by SanityRoot)
    in Ge (created by ThemeProvider)
    in ThemeProvider (created by SanityRoot)
    in ZIndexProvider (created by SanityRoot)
    in SanityRoot
    in AppContainer

React will try to recreate this component tree from scratch using the error boundary you provided, AppContainer.

AI Update

This error is a classic dependency version mismatch issue between @sanity/ui and other Sanity packages after running sanity upgrade. The useMediaIndex export error indicates that you have incompatible versions of Sanity packages installed, where @sanity/ui is trying to import a hook that doesn't exist in the version of its internal dependencies.

Here's how to fix it:

Quick Fix

Delete your node_modules and lockfile:

rm -rf node_modules
rm package-lock.json  # or yarn.lock / pnpm-lock.yaml

Reinstall dependencies:
```
npm install  # or yarn / pnpm install
```
Restart the dev server:
```
sanity start
```

If that doesn't work:

Check for version mismatches in your package.json. All @sanity/* packages should be on compatible versions. The issue typically happens when:

@sanity/ui is on a different major/minor version than expected by @sanity/base or sanity
Some packages got upgraded while others didn't
You have duplicate versions installed (check with npm list @sanity/ui)

Force align versions by running:

npm install @sanity/ui@latest sanity@latest

Or if you're on Studio v2 (which appears to be the case based on @sanity/base in your error), ensure all your @sanity/* packages are on compatible v2 versions. You might need to explicitly install matching versions:

npm install @sanity/ui@^0.x @sanity/base@^2.x

(Replace x with the appropriate minor versions that are compatible)

Root Cause

The sanity upgrade command sometimes doesn't upgrade all interdependent packages consistently, especially when there are peer dependency conflicts or when npm/yarn's resolution algorithm picks incompatible versions. The useMediaIndex hook was likely added/moved/removed between versions of @sanity/ui, and your installation has mismatched versions.

Prevention

When upgrading Sanity:

Always delete node_modules and lockfiles after upgrading
Check that all @sanity/* packages in package.json are on compatible versions
Run npm list @sanity/ui to verify what version is actually installed
Consider checking the Sanity upgrade documentation for version-specific migration guides

If you continue having issues after trying these steps, check your package.json for any version pinning (~ or exact versions) that might be preventing proper upgrades, and consider sharing your package versions for more specific troubleshooting help.

Seems to work now, after I performed npm i to see if it helped 🙂

npm i seems to be a bit of a panacea in the studio, haha.

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.

Get started for free Explore the demo