Get help on Discord

Error caused by multiple versions of @sanity/ui installed

17 replies
Last updated: Jan 28, 2021
I just updated the studio to 
^2.2.3
and I have this error as soon I open a document 👀
AI Update

I can see you're experiencing an error with Studio v2.2.3 when opening documents. While you didn't provide the specific error message (just the "👀" emoji), this version had some known issues that affected several users.

Here are the most common solutions that worked for others experiencing problems after updating to Studio v2.2.3:

1. Clear browser cache and cookies Studio v2 stores local state in your browser, and sometimes updates can cause conflicts. Try:

  • Clearing your browser's cache and cookies for your Studio URL
  • Opening Studio in an incognito/private window to test
  • Trying a different browser

2. Check for corrupted documents If the error only happens with specific documents, there might be corrupted data. You can use the CLI documents commands to inspect and fix problematic documents:

To view a specific document:

sanity documents get YOUR_DOCUMENT_ID

To edit a document directly:

sanity documents create --id YOUR_DOCUMENT_ID --replace

This will open your configured $EDITOR with the current document content. When you save and close the editor, it will replace the document with your edited version.

Important notes about the CLI:

  • Get the document's _id from the URL when you try to open it (e.g., http://localhost:3333/desk/post;14f09fac-ddad-d4d4-9ed5-4b12346b3f90)
  • If the document was published but stuck in draft mode, you may need to edit the draft version by prefixing the ID with drafts. (e.g., drafts.14f09fac-ddad-d4d4-9ed5-4b12346b3f90)
  • The --replace flag will overwrite the existing document with your changes

3. Update to a more stable version Studio v2.2.3 was a relatively early v2 release. Consider updating to a later v2 patch version:

npm install sanity@latest-v2

4. Check your browser console Open your browser's developer console (F12 or right-click → Inspect → Console) to see the specific error message. Common errors include:

  • TypeError: (value || []).some is not a function - usually indicates a schema mismatch where an array field has non-array data
  • Schema validation errors
  • Missing field errors

Important note: Studio v2 is now legacy software. The current version is Studio v3 (with v4 available for the latest features). If you're able to migrate, upgrading to v3+ will give you better stability, performance, and ongoing support.

If you can share the specific error message from your browser console, I can provide more targeted guidance for your exact issue!

Component stack below:
Same here
I too updated locally to 
^2.2.3
and got this message
The above error occurred in the <Card> component:
    in Card (created by DocumentPanel)
    in DocumentPanel (created by DocumentPane)
    in div (created by DocumentPane)
    in div (created by ForwardRef(ScrollContainer))
    in ForwardRef(ScrollContainer) (created by EnabledChangeConnectorRoot)
    in Tracker (created by EnabledChangeConnectorRoot)
    in EnabledChangeConnectorRoot (created by DocumentPane)
    in div (created by KeyboardShortcutResponder)
    in KeyboardShortcutResponder (created by GetHookCollectionState)
    in GetHookCollectionState (created by RenderActionCollectionState)
    in RenderActionCollectionState (created by DocumentActionShortcuts)
    in DocumentActionShortcuts (created by DocumentPane)
    in DocumentPane (created by DocumentPaneProvider)
    in DocumentHistoryProvider (created by DocumentPaneProvider)
    in DocumentPaneProvider
    in StreamingComponent
    in StreamingComponent (created by Context.Consumer)
    in WithInitialValueWrapper (created by DeskToolPane)
    in DeskToolPane (created by DeskToolPanes)
    in SplitPaneWrapper (created by DeskToolPanes)
    in div (created by Pane)
    in Pane (created by SplitPane)
    in div (created by SplitPane)
    in SplitPane (created by PanesSplitController)
    in div (created by PanesSplitController)
    in div (created by Pane)
    in Pane (created by SplitPane)
    in div (created by SplitPane)
    in SplitPane (created by PanesSplitController)
    in div (created by PanesSplitController)
    in PanesSplitController (created by DeskToolPanes)
    in div (created by DeskToolPanes)
    in DeskToolPanes (created by DeskTool)
    in DeskTool (created by withRouter(DeskTool))
    in withRouter(DeskTool) (created by DeskToolPaneStateSyncer)
    in DeskToolPaneStateSyncer (created by DeskTool)
    in DeskToolFeaturesProvider (created by DeskTool)
    in DeskTool (created by RenderTool)
    in RenderTool (created by SchemaErrorReporter)
    in RouteScope (created by SchemaErrorReporter)
    in div (created by SchemaErrorReporter)
    in div (created by SchemaErrorReporter)
    in div (created by SchemaErrorReporter)
    in SchemaErrorReporter (created by DefaultLayout)
    in DefaultLayout (created by withRouter(DefaultLayout))
    in withRouter(DefaultLayout) (created by DefaultLayoutRoot)
    in RouterProvider (created by DefaultLayoutRoot)
    in LoginWrapper (created by DefaultLayoutRoot)
    in DefaultLayoutRoot (created by AppProvider)
    in div (created by styled.div)
    in styled.div (created by Box)
    in Box (created by Styled(Box))
    in Styled(Box) (created by Card)
    in Ge (created by ThemeProvider)
    in ThemeProvider (created by ThemeColorProvider)
    in ThemeColorProvider (created by Card)
    in Card (created by Styled(Card))
    in Styled(Card) (created by AppProvider)
    in SnackbarProvider (created by AppProvider)
    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 SanityRoot
    in AppContainer

React will try to recreate this component tree from scratch using the error boundary you provided, RenderTool. react_devtools_backend.js:2430:23
Thanks all, we're investigating this at the moment.
This is caused by having multiple versions of 
@sanity/ui
installed. You can work around it by making sure to install the same version of 
@sanity/ui
as the one 
@sanity/base
installs 🙂 We're working on a better solution for this 😄
npm install @sanity/ui@0.32.8
Awesome. Thanks for the quick work 👍
I tried this, still getting the same issue 🤔 i also tried deleting my node_modules and yarn.lock without any success
Yeah, it created a different issue for me (reported in different thread in sanity-ui)
😒 I tried to revert all my changes and now i cant even access my studio anymore...
second problem was fixed after i deleted my node_modules &gt;.&gt;
user S
that 
gray
error was the same one I hit after 
yarn add @sanity/ui@0.32.8
. You’re saying deleting your node modules resolved the issue? Then did you run 
yarn add
to add everything back?
so i reverted all my changes to package to the version before updating sanity, then yes delete the node modules, aswell as package.lock or yarn.lock
oh gotcha, so you were unable to get their fix to work?
Luckily I’m ok with my broken updated branch and can work on something else while waiting for a fix 😁
It if helps, the new version of the sanity-plugin-media was also responsible for the crash. After reverting both sanity and the media plugin, I’m back to business 😅
For those of you still struggling after installing an older version of 
@sanity/ui
manually. I'm thinking maybe there is some other package depending on 
@sanity/ui
which could have a different version. Or maybe "something" is overriding you so when you install you still effectively end up with different versions.
1. Try removing 
node_modules
that should be a good bet in most cases2. If problem persist search your 
node_modules
directory to see which versions of 
@sanity/ui
reside in it. I've written a 
find
-command you can use:
$ find node_modules -type d -iname 'ui*' -exec grep --with-filename 'version": ' {}/package.json \;
This will find all 
@sanity/ui
directories and print the 
version
from 
package.json
. For instance in this studio where I've installed different versions on purpose:

❯ find node_modules -type d -iname 'ui*' -exec grep --with-filename 'version": ' {}/package.json \;
node_modules/@sanity/ui/package.json:  "version": "0.33.0"
node_modules/@sanity/desk-tool/node_modules/@sanity/ui/package.json:  "version": "0.32.9"
node_modules/@sanity/form-builder/node_modules/@sanity/ui/package.json:  "version": "0.32.9"
node_modules/@sanity/base/node_modules/@sanity/ui/package.json:  "version": "0.32.9"
(Notice top is different from all the others)

This should let you identify if other plugins (etc.) install a different version.

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 freeExplore the demo

Was this answer helpful?