Next.js + Sanity monorepo: Can't resolve 'react-icons' on Vercel build

Based on your error, this is a classic monorepo dependency resolution issue when deploying to Vercel. The problem is that Vercel's build process can't find react-icons even though it's listed in your sanity/package.json, because of how monorepos handle dependency hoisting and module resolution.

Here are the most common solutions:

1. Configure Vercel's Root Directory and Install Command

In your Vercel project settings (or vercel.json), you need to tell Vercel:

• Which directory to build from (your Next.js app)
• How to install dependencies for the entire monorepo

If your Next.js app is in a subdirectory, set the Root Directory in Vercel to point to it, but keep the Install Command running from the monorepo root. For example:

{
  "buildCommand": "cd apps/web && npm run build",
  "installCommand": "npm install"
}

2. Ensure Dependencies Are Properly Hoisted

With Lerna, dependencies might not be hoisted correctly. Make sure your root package.json has the proper workspace configuration. If using npm/yarn workspaces:

{
  "workspaces": [
    "sanity",
    "web"
  ]
}

3. Install react-icons in Multiple Locations

Sometimes the quickest fix is to install react-icons in both:

• Your sanity/package.json (which you already have)
• Your Next.js app's package.json
• Optionally, the root package.json

This ensures it's available regardless of how the build process resolves modules.

4. Check Your Schema Imports

Since the error mentions /sanity/schemas, check if you're importing icons in your schema files. If your Next.js build is trying to bundle Sanity schemas (perhaps for type generation or live previews), it needs access to those dependencies. You might need to adjust your Next.js webpack config or ensure the Sanity workspace dependencies are available during the Next.js build.

5. Use PNPM Workspaces Instead

As mentioned in the Sanity monorepo documentation, PNPM workspaces have become the popular standard for monorepo management with Sanity projects. PNPM handles dependency resolution more predictably than Lerna in many cases. Consider migrating if the issue persists.

Looking at the nextjs-ecommerce-starter that works for you, compare:

• How they structure their package.json files
• Whether they use npm workspaces, yarn workspaces, or pnpm
• Their Vercel configuration settings

The key is ensuring Vercel's build process can resolve dependencies across your workspace during the build phase. The error suggests the Next.js build is trying to process your Sanity schema files but can't find their dependencies in the expected location.