v0 preview window stuck loading with pnpm dependency resolution errors

v0
, , ,
1

Problem

I have a simple side project that works as a calendar, where every day I add new content in a dialog. I built it to test a few AI tools (yes, I’m quite noob at this), and to make a gift for my girlfriend. It’s integrated with GitHub, and I make most of the design with Figma Make before sending it to v0 for implementation. So, the workflow is: create something with Figma Make, ask it to export designs that are taken to v0, and simple changes are done directly in the code editor at GitHub.

Problem is, lately v0 is failing to handle the preview window, and I’m at the dark when doing any work there. It just loads forever, and keeps the preview panel grey. I’ll share some screenshots as a reference.

I’m trying to fix it in v0, naturally, but I’m just spending credits and no solution is coming out of it. I’ll give you some of the texts it sent me when trying to describe and fix the problem:

Attempted Fixes

First time the issue appeared

Observation: The dev server started on port 5174 instead of 5173 because the old process was still occupying the port. This is what’s causing the blank preview. Let me make a small edit to force a clean restart:

Read main.tsx
Restarted dev server v50
Restore

That edit should force the dev server to restart cleanly on port 5173. The preview should come back in a few seconds — give it a moment and refresh the preview panel if it doesn’t auto-reload.

One of the attempts to fix

Error: I see the issue now. The logs show pnpm is failing because React is not being resolved correctly — hundreds of “missing peer react” warnings indicate a broken dependency state in the sandbox. This isn’t a code issue, it’s a corrupt node_modules.

The quickest fix is to delete pnpm-lock.yaml so the sandbox reinstalls fresh dependencies:

Deleted pnpm-lock.yaml
Now trigger a reinstall by touching package.json:

Read package.json

Diagnosis: The issue is clear now. React and react-dom are listed as peerDependencies (optional) instead of dependencies, so they’re not being installed. Let me fix this:

Moved React to dependencies v56
Added react and react-dom as direct dependencies instead of just peer dependencies. Deleted pnpm-lock.yaml to force a clean reinstall. The sandbox should now install all packages correctly including React, and the preview will come back up.

Final attempt

Root Cause: The real problem is clear. When I deleted pnpm-lock.yaml, pnpm reinstalled everything but couldn’t find React because the package.json has React only in peerDependencies, not dependencies. My earlier fix added React to dependencies but the lock file deletion caused a race condition. The real fix is to add a .npmrc to tell pnpm to auto-install peer dependencies, which is the correct pnpm configuration for this project:

React is correctly in dependencies now. The problem is pnpm by default doesn’t auto-install peer deps. I need to create an .npmrc with auto-install-peers=true:

Created .npmrc v57

auto-install-peers=true

This tells pnpm to automatically install peer dependencies and not fail hard on peer dependency mismatches. Combined with React already being in dependencies, this should resolve all the “missing peer react” errors and get the dev server running again.

image
image1919×1072 155 KB

Environment

6

Thank you for sharing your link! Can you try duplicating the chat to see if the preview works then?