Fix Storybook build by ensuring workspace dependencies are built first#251
Fix Storybook build by ensuring workspace dependencies are built first#251
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
Ensures the @object-ui/components Storybook build succeeds on Vercel by compiling required workspace dependencies before Storybook bundles.
Changes:
- Added a shared
prebuildscript that builds@object-ui/types,@object-ui/core, and@object-ui/reactin order. - Wired
pretestandprebuild-storybookto run the sharedprebuildscript. - Included
@object-ui/typesin the dependency build step for consistency.
| "pretest": "pnpm run prebuild", | ||
| "test": "vitest run", | ||
| "type-check": "tsc --noEmit", | ||
| "lint": "eslint .", |
There was a problem hiding this comment.
The Storybook dev script (storybook) likely has the same workspace-resolution problem as build-storybook: stories import local renderers that import @object-ui/core at runtime, and @object-ui/core resolves to ./dist/index.js. In a clean checkout (no prior tsc), pnpm run storybook will still fail because there is no prestorybook hook to build the workspace deps first. Consider adding a prestorybook script that runs pnpm run prebuild (or otherwise ensuring deps are built before storybook dev).
| "lint": "eslint .", | |
| "lint": "eslint .", | |
| "prestorybook": "pnpm run prebuild", |
📦 Bundle Size Report
Size Limits
|
|
✅ All checks passed!
|
Vercel's Storybook build for
@object-ui/componentsfails because it attempts to resolve@object-ui/corebefore its TypeScript compilation has run. The package.json points to./dist/index.js, butdist/doesn't exist untiltscruns.Changes
prebuild-storybookhook to build workspace dependencies (@object-ui/types,@object-ui/core,@object-ui/react) before Storybook buildsprebuildscript to eliminate duplication betweenpretestandprebuild-storybookpretestto include@object-ui/typesfor consistencypackages/components/package.json:
The
prebuild-storybookhook executes automatically whenpnpm run build-storybookis called, ensuring dependencies are compiled in dependency order before Storybook attempts to bundle them.Warning
Firewall rules blocked me from connecting to one or more addresses (expand for details)
I tried to connect to the following addresses, but was blocked by firewall rules:
storybook.js.org/usr/local/bin/node node /home/REDACTED/work/objectui/objectui/packages/components/node_modules/.bin/../storybook/bin/index.cjs build(dns block)If you need me to access, download, or install something from one of these locations, you can either:
Original prompt
18:34:42.868 Running build in Washington, D.C., USA (East) – iad1
18:34:42.869 Build machine configuration: 4 cores, 8 GB
18:34:42.979 Cloning github.com/objectstack-ai/objectui (Branch: main, Commit: 8ce9942)
18:34:42.980 Previous build caches not available.
18:34:43.362 Cloning completed: 382.000ms
18:34:43.915 Running "vercel build"
18:34:44.883 Vercel CLI 50.5.2
18:34:45.490 Detected
pnpm-lock.yaml9 which may be generated by pnpm@9.x or pnpm@10.x18:34:45.490 Using pnpm@10.x based on project creation date
18:34:45.490 To use pnpm@9.x, manually opt in using corepack (https://vercel.com/docs/deployments/configure-a-build#corepack)
18:34:45.491 Running "install" command:
pnpm install...18:34:46.145 Scope: all 27 workspace projects
18:34:46.348 ../.. | Progress: resolved 1, reused 0, downloaded 0, added 0
18:34:46.490 ../.. | +1420 ++++++++++++++++++++++++++++
18:34:47.350 ../.. | Progress: resolved 1420, reused 0, downloaded 47, added 14
18:34:48.351 ../.. | Progress: resolved 1420, reused 0, downloaded 174, added 70
18:34:49.351 ../.. | Progress: resolved 1420, reused 0, downloaded 218, added 91
18:34:50.352 ../.. | Progress: resolved 1420, reused 0, downloaded 222, added 93
18:34:51.355 ../.. | Progress: resolved 1420, reused 0, downloaded 370, added 174
18:34:52.359 ../.. | Progress: resolved 1420, reused 0, downloaded 525, added 230
18:34:53.360 ../.. | Progress: resolved 1420, reused 0, downloaded 604, added 260
18:34:54.361 ../.. | Progress: resolved 1420, reused 0, downloaded 844, added 349
18:34:55.361 ../.. | Progress: resolved 1420, reused 0, downloaded 991, added 394
18:34:56.362 ../.. | Progress: resolved 1420, reused 0, downloaded 1105, added 448
18:34:57.363 ../.. | Progress: resolved 1420, reused 0, downloaded 1330, added 533
18:34:58.364 ../.. | Progress: resolved 1420, reused 0, downloaded 1418, added 603
18:34:59.364 ../.. | Progress: resolved 1420, reused 0, downloaded 1418, added 1024
18:35:00.364 ../.. | Progress: resolved 1420, reused 0, downloaded 1418, added 1257
18:35:01.265 ../.. | Progress: resolved 1420, reused 0, downloaded 1418, added 1420, done
18:35:02.155
18:35:02.155 dependencies:
18:35:02.155 + @object-ui/core 0.3.1 <- ../core
18:35:02.155 + @object-ui/react 0.3.1 <- ../react
18:35:02.155 + @object-ui/types 0.3.1 <- ../types
18:35:02.156 + @radix-ui/react-accordion 1.2.12
18:35:02.156 + @radix-ui/react-alert-dialog 1.1.15
18:35:02.156 + @radix-ui/react-aspect-ratio 1.1.8
18:35:02.156 + @radix-ui/react-avatar 1.1.11
18:35:02.156 + @radix-ui/react-checkbox 1.3.3
18:35:02.156 + @radix-ui/react-collapsible 1.1.12
18:35:02.156 + @radix-ui/react-context-menu 2.2.16
18:35:02.156 + @radix-ui/react-dialog 1.1.15
18:35:02.156 + @radix-ui/react-dropdown-menu 2.1.16
18:35:02.156 + @radix-ui/react-hover-card 1.1.15
18:35:02.156 + @radix-ui/react-label 2.1.8
18:35:02.156 + @radix-ui/react-menubar 1.1.16
18:35:02.156 + @radix-ui/react-navigation-menu 1.2.14
18:35:02.156 + @radix-ui/react-popover 1.1.15
18:35:02.157 + @radix-ui/react-progress 1.1.8
18:35:02.157 + @radix-ui/react-radio-group 1.3.8
18:35:02.157 + @radix-ui/react-scroll-area 1.2.10
18:35:02.157 + @radix-ui/react-select 2.2.6
18:35:02.157 + @radix-ui/react-separator 1.1.8
18:35:02.157 + @radix-ui/react-slider 1.3.6
18:35:02.157 + @radix-ui/react-slot 1.2.4
18:35:02.157 + @radix-ui/react-switch 1.2.6
18:35:02.157 + @radix-ui/react-tabs 1.1.13
18:35:02.157 + @radix-ui/react-toast 1.2.15
18:35:02.157 + @radix-ui/react-toggle 1.1.10
18:35:02.157 + @radix-ui/react-toggle-group 1.1.11
18:35:02.157 + @radix-ui/react-tooltip 1.2.8
18:35:02.157 + class-variance-authority 0.7.1
18:35:02.157 + clsx 2.1.1
18:35:02.157 + cmdk 1.1.1
18:35:02.158 + date-fns 4.1.0
18:35:02.158 + embla-carousel-react 8.6.0
18:35:02.158 + input-otp 1.4.2
18:35:02.158 + lucide-react 0.563.0
18:35:02.158 + next-themes 0.4.6
18:35:02.158 + react 19.2.3
18:35:02.158 + react-day-picker 9.13.0
18:35:02.158 + react-dom 19.2.3
18:35:02.158 + react-hook-form 7.71.1
18:35:02.158 + react-resizable-panels 4.5.2
18:35:02.158 + recharts 2.15.4
18:35:02.158 + sonner 2.0.7
18:35:02.158 + tailwind-merge 3.4.0
18:35:02.158 + tailwindcss-animate 1.0.7
18:35:02.158 + vaul 1.1.2
18:35:02.158
18:35:02.158 devDependencies:
18:35:02.159 + @storybook/addon-essentials 8.6.14
18:35:02.159 + @storybook/addon-interactions 8.6.14
18:35:02.159 + @storybook/addon-links 8.6.15
18:35:02.159 + @s...
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.