Get help on Discord

Issue installing the official sanity media plugin on Sanity v3.

4 replies
Last updated: Jan 16, 2023
Hello dear community!I’m having hard times installing the official sanity media plugin on Sanity v3.
I start from a blank project using 
npm create sanity@latest
and then I run 
npm install --save sanity-plugin-media@studio-v3
but I keep getting this message:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: sanity-v3-test@1.0.0
npm ERR! Found: sanity@3.2.3
npm ERR! node_modules/sanity
npm ERR!   sanity@"^3.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer sanity@"dev-preview || 3.0.0-rc.0" from sanity-plugin-media@2.0.0-v3-studio.3
npm ERR! node_modules/sanity-plugin-media
npm ERR!   sanity-plugin-media@"2.0.0-v3-studio.3" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
I haven’t done any type of configuration, I’m using
node v18 LTS and I run this command on macOS Monterey.
Does anyone have experience with this issue?
AI Update

The issue you're encountering is a peer dependency conflict with the sanity-plugin-media package. The version you're trying to install with the @studio-v3 tag (2.0.0-v3-studio.3) was built for Sanity v3's dev-preview/release candidate versions, but you're running the stable release of Sanity v3 (3.2.3).

According to the official plugin page, here's how to fix this:

Install the latest stable version instead:

npm install sanity-plugin-media

Don't specify the @studio-v3 tag – that was only for the preview/RC period during Sanity v3's development. The current stable version of sanity-plugin-media (version 2.x and above) already supports Sanity v3 out of the box.

Then add it to your sanity.config.ts (or .js):

import {defineConfig} from 'sanity'
import {media} from 'sanity-plugin-media'

export default defineConfig({
  // ... other config
  plugins: [
    media()
  ]
})

The confusion here is common – during Sanity v3's development period, plugin authors used tags like @studio-v3 or @v3-studio to indicate preview compatibility. Now that Sanity v3 is stable, the main package versions have caught up, and those old tags are outdated with incompatible peer dependencies (specifically looking for sanity@"dev-preview || 3.0.0-rc.0" instead of stable versions like your 3.2.3).

If you still encounter issues:

  1. Delete node_modules and package-lock.json
  2. Run npm install again
  3. Or use the --legacy-peer-deps flag: npm install sanity-plugin-media --legacy-peer-deps (though this shouldn't be necessary with the correct version)

Your Node v18 LTS setup is perfectly fine for Sanity v3, so that's not causing the issue. The plugin will work as both a standalone tool (accessible in your studio menu) and as an additional asset source for your image and file fields once properly installed.

This is the package.json file:
{
  "name": "sanity-v3-test",
  "private": true,
  "version": "1.0.0",
  "main": "package.json",
  "license": "UNLICENSED",
  "scripts": {
    "dev": "sanity dev",
    "start": "sanity start",
    "build": "sanity build",
    "deploy": "sanity deploy",
    "deploy-graphql": "sanity graphql deploy"
  },
  "keywords": [
    "sanity"
  ],
  "dependencies": {
    "@sanity/vision": "^3.0.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-is": "^18.2.0",
    "sanity": "^3.0.0",
    "styled-components": "^5.2.0"
  },
  "devDependencies": {
    "@sanity/eslint-config-studio": "^2.0.1",
    "eslint": "^8.6.0",
    "prettier": "^2.8.3",
    "typescript": "^4.0.0"
  },
  "prettier": {
    "semi": false,
    "printWidth": 100,
    "bracketSpacing": false,
    "singleQuote": true
  }
}
Try 
npm install --save sanity-plugin-media
?
Running just that command worked!I guess the readme file mislead me a bit. I wasn’t sure what was the best way to install the plugin with the newest studio. Thanks
user Y
!
For sure! It seems like the README is a bit outdated. We’ll get on that!

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?