fix(examples): make react-start example compatible with npm-based sandboxes#323
fix(examples): make react-start example compatible with npm-based sandboxes#323Dhavanesh24cs412 wants to merge 2 commits intoTanStack:mainfrom
Conversation
- Replace hardcoded 400px height with viewport-relative calculation - Height now scales as 50% of viewport height - Respects minimum (300px) and maximum (400px) constraints - Fixes issue where devtools panel was fixed to small height in fullscreen - Panel now properly adapts to different screen sizes Fixes TanStack#320
|
|
This solution addresses the workspace protocol compatibility issue well by replacing Yarn-specific |
2 participants
Description
Fixes #321 - TanStack Start example now works in interactive sandboxes by replacing Yarn workspace protocol with published npm version.
Problem
The React Start example (
examples/react/start) usesworkspace:*protocol for the@tanstack/devtools-event-clientdependency. This protocol is specific to Yarn workspaces and is not supported by npm, which is the package manager used by CodeSandbox, StackBlitz, and other interactive sandbox environments.Error Before Fix
npm error code EUNSUPPORTEDPROTOCOL
npm error Unsupported URL Type "workspace:"
This prevents users from accessing the example in any npm-based interactive sandbox.
Solution
Replaced the workspace protocol with the published npm version of the dependency:
"@tanstack/devtools-event-client": "workspace:*""@tanstack/devtools-event-client": "^0.4.0"The version
0.4.0is the latest published version on npm and provides the same functionality.Changes
examples/react/start/package.json@tanstack/devtools-event-clientdependency versionTesting
npm installcompletes successfully without workspace protocol errorsnpm run devstarts the development server without errorsType of Change
Related Issues
Closes #321