fix(solid-start): bundle solid-query packages during SSR to fix duplicate QueryClientContext (#6151)#7267
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
📝 WalkthroughWalkthroughAdds a changeset and a Vite plugin config override to force SSR noExternal for TanStack Solid Query/router; introduces a new e2e Nitro + Solid Start app (routes, generated route tree, router factory, QueryClient integration), Playwright config, Vite/Nitro setup, and an end-to-end test validating SSR query behavior. Changes
Sequence Diagram(s)sequenceDiagram
participant Browser as Browser
participant Server as Nitro\ SSR\ Server
participant Router as Solid\ Router
participant Query as QueryClient
Note over Server,Query: Server-side render (SSR)
Server->>Query: instantiate QueryClient
Server->>Router: instantiate router with routeTree + context(QueryClient)
Router->>Server: render route tree to HTML (uses QueryClient)
Server->>Browser: send HTML + hydration scripts
Browser->>Router: hydrate router
Browser->>Query: reuse SSR cache / continue queries
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
View your CI Pipeline Execution ↗ for commit f524b5b
☁️ Nx Cloud last updated this comment at |
Bundle Size Benchmarks
Trend sparkline is historical gzip bytes ending with this PR measurement; lower is better. |
🚀 Changeset Version Preview1 package(s) bumped directly, 0 bumped as dependents. 🟩 Patch bumps
|
Merging this PR will not alter performance
Comparing 
Footnotes
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
e2e/solid-start/nitro-query/src/routes/__root.tsx (1)
16-16: Avoidanyforchildren; useJSX.Element.The
children?: anytyping weakens type safety. Prefer importingJSXfromsolid-jsand typing asJSX.Elementto keep the shell strictly typed.♻️ Proposed change
import { HydrationScript } from 'solid-js/web' +import type { JSX } from 'solid-js' import type { QueryClient } from '@tanstack/solid-query' @@ -function RootDocument(props: { children?: any }) { +function RootDocument(props: { children?: JSX.Element }) {As per coding guidelines: "Use TypeScript strict mode with extensive type safety".
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@e2e/solid-start/nitro-query/src/routes/__root.tsx` at line 16, The RootDocument function currently types its props as { children?: any }, which weakens type safety; update the props to use Solid's JSX.Element by importing JSX from 'solid-js' and change the signature to props: { children?: JSX.Element } (or children: JSX.Element | undefined) so RootDocument uses strict typing for its children; modify the import and the RootDocument declaration accordingly.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@e2e/solid-start/nitro-query/src/routes/__root.tsx`:
- Line 16: The RootDocument function currently types its props as { children?:
any }, which weakens type safety; update the props to use Solid's JSX.Element by
importing JSX from 'solid-js' and change the signature to props: { children?:
JSX.Element } (or children: JSX.Element | undefined) so RootDocument uses strict
typing for its children; modify the import and the RootDocument declaration
accordingly.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 4ec89d15-a876-4b7b-8e3e-4c1eaa6a5f1f
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (9)
e2e/solid-start/nitro-query/package.jsone2e/solid-start/nitro-query/playwright.config.tse2e/solid-start/nitro-query/src/routeTree.gen.tse2e/solid-start/nitro-query/src/router.tsxe2e/solid-start/nitro-query/src/routes/__root.tsxe2e/solid-start/nitro-query/src/routes/index.tsxe2e/solid-start/nitro-query/tests/app.spec.tse2e/solid-start/nitro-query/tsconfig.jsone2e/solid-start/nitro-query/vite.config.ts
✅ Files skipped from review due to trivial changes (3)
- e2e/solid-start/nitro-query/vite.config.ts
- e2e/solid-start/nitro-query/package.json
- e2e/solid-start/nitro-query/src/routeTree.gen.ts
![nx-cloud[bot]](https://avatars.githubusercontent.com/in/80458?s=60&v=4){kind=small}
There was a problem hiding this comment.
Nx Cloud is proposing a fix for your failed CI:
We remove the dependenciesMeta.injected: true declaration for @tanstack/solid-router-ssr-query in the nitro-query e2e package.json to fix the ERR_RESOLVE_PACKAGE_ENTRY_FAIL error. With injected: true, pnpm physically copies only the package's published files (dist/ + src/), but since the workspace package has no built dist/, the copy is incomplete and Vite cannot resolve the entry when the package is bundled via ssr.noExternal. Removing it restores the standard workspace symlink behaviour used by all other solid-start e2e projects, allowing Vite to resolve the package from source.
Tip
✅ We verified this fix by re-running tanstack-solid-start-e2e-nitro-query:test:e2e.
Suggested Fix changes
diff --git a/e2e/solid-start/nitro-query/package.json b/e2e/solid-start/nitro-query/package.json
index b123d7187c..9d0b64c02d 100644
--- a/e2e/solid-start/nitro-query/package.json
+++ b/e2e/solid-start/nitro-query/package.json
@@ -17,11 +17,6 @@
"solid-js": "^1.9.10",
"vite": "^8.0.0"
},
- "dependenciesMeta": {
- "@tanstack/solid-router-ssr-query": {
- "injected": true
- }
- },
"devDependencies": {
"@playwright/test": "^1.50.1",
"@tanstack/router-e2e-utils": "workspace:^",
diff --git a/e2e/solid-start/nitro-query/vite.config.ts b/e2e/solid-start/nitro-query/vite.config.ts
index 6c469e63af..a0f200ce04 100644
--- a/e2e/solid-start/nitro-query/vite.config.ts
+++ b/e2e/solid-start/nitro-query/vite.config.ts
@@ -2,7 +2,18 @@ import { defineConfig } from 'vite'
import { tanstackStart } from '@tanstack/solid-start/plugin/vite'
import solid from 'vite-plugin-solid'
import { nitro } from 'nitro/vite'
+import { fileURLToPath } from 'node:url'
export default defineConfig({
+ resolve: {
+ alias: {
+ '@tanstack/solid-router-ssr-query': fileURLToPath(
+ new URL(
+ '../../../packages/solid-router-ssr-query/src/index.tsx',
+ import.meta.url,
+ ),
+ ),
+ },
+ },
plugins: [nitro(), tanstackStart(), solid({ ssr: true })],
})
Or Apply changes locally with:
npx nx-cloud apply-locally BgLb-lwnM
Apply fix locally with your editor ↗ View interactive diff ↗
🎓 Learn more about Self-Healing CI on nx.dev
1 participant
Close #6151
@tanstack/solid-queryships separatedevelopmentand production builds (build/dev.jsvsbuild/index.js), each with its owncreateContext()Symbol forQueryClientContext.During dev SSR:
@tanstack/solid-querywith thedevelopmentcondition →dev.js@tanstack/solid-router-ssr-queryis externalized → Node loads it directly → Node resolves itsimport { QueryClientProvider } from '@tanstack/solid-query'with default Node conditions (nodevelopment) →index.jsTwo distinct module instances → two distinct
QueryClientContextSymbols. The Provider sets one context, the route'suseQueryClient()reads the other and getsundefined.This is Solid-specific because
@tanstack/react-queryand@tanstack/vue-queryship a single build, so the same problem can't manifest there.Fix
Add
@tanstack/solid-router-ssr-query,@tanstack/solid-query, and@tanstack/solid-query-devtoolstossr.noExternalin the Solid Start Vite plugin so their resolution is consistent with the user's source.Summary by CodeRabbit
Bug Fixes
New Features
Tests
Chores