Sanity v3 styled-components peer dependency conflict on upgrade

13 replies
Last updated: Nov 29, 2025
I am attempting to update a simple Sanity project to the latest dependencies. Here is my current package.json . Per documentation , I am doing
npm install sanity@latest
and getting the immediate failure:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: loumarc@1.0.0
npm ERR! Found: styled-components@5.3.11
npm ERR! node_modules/styled-components
npm ERR!   styled-components@"^5.2.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer styled-components@"^6.1" from sanity@3.38.0
npm ERR! node_modules/sanity
npm ERR!   sanity@"3.38.0" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
I don't care about
styled-components
. I don't use
styled-components
. I assume the only reason this is in my
package.json
is because Sanity needs it. I tried removing it from my deps, and still get this error. I am at a loss. What is this error trying to tell me? How do I fix it?
AI Update

This error is telling you that Sanity v3.38.0 requires styled-components version 6.1 or higher, but your project currently has version 5.3.11 installed. Even though you're not directly using styled-components in your code, it's a peer dependency of Sanity Studio itself (specifically packages like @sanity/ui and @sanity/vision that Studio depends on).

Starting around Sanity v3.37-3.38, the platform updated its peer dependency requirement for styled-components from v5 to v6. Your project still has v5 installed, creating this conflict.

How to fix it:

Option 1: Update styled-components alongside Sanity (recommended)

Upgrade styled-components to v6 at the same time:

npm install sanity@latest styled-components@^6.1

This is the cleanest solution and ensures compatible dependencies.

Option 2: Delete package-lock.json and reinstall (most reliable)

Based on the community discussion, this often resolves the issue:

rm package-lock.json
npm install sanity@latest styled-components@^6.1

The package-lock.json file can sometimes lock you into incompatible dependency trees, and removing it allows npm to resolve dependencies fresh. Multiple community members confirmed this approach worked when other methods didn't.

Option 3: Update your package.json manually

Edit your package.json to change the styled-components version:

"styled-components": "^6.1.8"

Then run:

npm install

Option 4: Use legacy peer deps flag (temporary workaround)

If you need a quick bypass (though not recommended long-term):

npm install sanity@latest --legacy-peer-deps

As one community member noted, this is "frowned upon" and "shouldn't be necessary" - it's asking for potential future issues.

Why this happened:

The error specifically mentions @sanity/vision@3.14.4 which has a peer dependency on styled-components@"^5.2", while newer Sanity packages require v6. This creates a conflict. The sanity upgrade documentation mentions that when upgrading from earlier versions, you may need to upgrade additional dependencies like styled-components and @sanity/ui.

Also check: If you have @sanity/ui or @sanity/vision explicitly listed in your package.json, make sure to update those to their latest versions as well, as older versions may also require styled-components v5.

Show original thread
13 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.

Was this answer helpful?