Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Vite 8: dep scan JSX is only set for the client environment, so ssr scans (e.g. Cloudflare) fail on react/jsx-dev-runtime

Aperta
#387 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
68/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
build-system

Direzione di ricerca

Start with vite.config.ts and run node scan-check.mjs to reproduce the client and ssr dependency scans. Locate the plugin's config and configEnvironment handling, then verify that both scans complete without the react/jsx-dev-runtime resolution failure while preserving the existing client behavior.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Summary

On Vite 8, the plugin sets the dep scanner's JSX option (optimizeDeps.rolldownOptions.transform.jsx) only in the top-level config hook. Vite applies top-level optimizeDeps to the client environment only, so any other environment with dep discovery on still scans .tsx with Rolldown's default: React's automatic runtime. The scan then fails on an unresolvable react/jsx-dev-runtime import, and dev skips pre-bundling for that environment.

Server environments default to noDiscovery: true, so plain Node SSR never hits this. Frameworks that run SSR outside Node turn discovery back on. We hit it with @cloudflare/vite-plugin 1.60.1 (TanStack Start on Workers), and the repro below does the same with one config line.

This is separate from #262. #363 fixes the client environment but not this one: I ran the repro against #363's pkg.pr.new build, and the client scan passes while the ssr scan still fails. On next, the scanner JSX is still set only in the top-level optimizeDeps, and neither configEnvironment hook sets it.

Versions

vite 8.3.1, vite-plugin-solid 2.11.14 and the #363 build (https://pkg.pr.new/solidjs/solid-vite-plugin/vite-plugin-solid@363), solid-js 1.9.15, Node 24.18.0.

Reproduction

package.json

{
  "name": "solid-vite8-ssr-scan-repro",
  "private": true,
  "type": "module",
  "dependencies": { "solid-js": "1.9.15" },
  "devDependencies": { "vite": "8.3.1", "vite-plugin-solid": "2.11.14" }
}

vite.config.ts

import { defineConfig } from 'vite'
import solid from 'vite-plugin-solid'

export default defineConfig({
  plugins: [solid({ ssr: true })],
  environments: {
    // Server environments default to noDiscovery: true. Frameworks that run SSR
    // outside Node turn it back on (@cloudflare/vite-plugin does); so does this.
    ssr: { optimizeDeps: { noDiscovery: false, entries: ['src/entry-server.tsx'] } },
  },
})

index.html

<!doctype html><html><body><div id="app"></div><script type="module" src="/src/entry-client.tsx"></script></body></html>

src/entry-client.tsx

import { render } from 'solid-js/web'
import { App } from './App'
render(() => <App />, document.getElementById('app')!)

src/entry-server.tsx

import { renderToString } from 'solid-js/web'
import { App } from './App'
export const render = () => renderToString(() => <App />)

src/App.tsx

import { Pictures } from './Pictures'
export const App = () => <Pictures />

src/Pictures.tsx (uses import.meta.glob, so the same repro also shows #262 on the client; src/pics/a.svg is any SVG)

const pics = import.meta.glob('./pics/*.svg', { eager: true, import: 'default' })
export const Pictures = () => <p>{Object.keys(pics).length} pictures</p>

Run vite and request /. The ssr scan logs:

(!) Failed to run dependency scan. Skipping dependency pre-bundling. Error: The following dependencies are imported but could not be resolved:

  react/jsx-dev-runtime (imported by src/Pictures.tsx)

Are they installed?
scan-check.mjs: reports each environment's scan result deterministically
// Starts the dev server, waits for every environment's dep scan, and reports
// which environments' scans failed. Clears the optimizer cache so the scan runs.
import { rmSync } from 'node:fs'
import { createServer } from 'vite'

rmSync('node_modules/.vite', { recursive: true, force: true })
const server = await createServer({ server: { port: 0 }, logLevel: 'silent' })
const failed = {}
for (const [name, env] of Object.entries(server.environments)) {
  env.logger = { ...env.logger, error(msg) {
    if (msg.includes('Failed to run dependency scan')) failed[name] = msg.replace(/\x1b\[[0-9;]*m/g, '').split('\n').filter(Boolean).slice(0, 3).join(' ').replace(/\s+/g, ' ')
  } }
}
await server.listen()
await fetch(server.resolvedUrls.local[0])
for (const [name, env] of Object.entries(server.environments)) {
  const opt = env.depsOptimizer
  if (!opt || opt.options.noDiscovery) { console.log(`${name}: discovery off, no scan`); continue }
  for (let i = 0; i < 100 && !opt.scanProcessing; i++) await new Promise((r) => setTimeout(r, 50))
  await opt.scanProcessing
  console.log(`${name}: ${failed[name] ? 'SCAN FAILED — ' + failed[name] : 'scan ok'}`)
}
await server.close()

Results

node scan-check.mjs, three runs per row, same result every run:

vite-plugin-solid client scan ssr scan
2.11.14 fails: PARSE_ERROR Unexpected JSX expression (#262) fails: react/jsx-dev-runtime unresolved
#363 build ok fails: react/jsx-dev-runtime unresolved
2.11.14 + workaround below ok ok

In our app, the skipped pre-bundling showed up in the browser as You appear to have multiple instances of Solid, useRouter must be used inside a <RouterProvider>, and uncaught errors on load (Cannot read properties of null (reading 'isServer'), and in another run _$HY is not defined). We have a single solid-js in the lockfile.

Cause

In Vite 8.3.1's config resolution, the client environment's defaults include optimizeDeps: config.optimizeDeps, and the defaults for other environments don't (getDefaultEnvironmentOptions plus the client-only override). So the top-level value the plugin returns from config never reaches ssr: resolving the config above gives environments.ssr.config.optimizeDeps.rolldownOptions.transform.jsx === undefined, while client gets the plugin's value.

Suggested fix

Set the scanner JSX in configEnvironment for every environment instead of (or as well as) top-level, e.g.

configEnvironment(name, config) {
  config.optimizeDeps ??= {}
  config.optimizeDeps.rolldownOptions ??= {}
  config.optimizeDeps.rolldownOptions.transform ??= {}
  config.optimizeDeps.rolldownOptions.transform.jsx ??= { runtime: 'classic' }
}

I tested this as a separate plugin in the repro. On top of the #363 build, both scans pass. On 2.11.14 alone, only ssr passes: the ??= keeps the top-level 'preserve' on client, which is #262. So it's #363's change plus this hook.

Workaround

Set it per environment in the app's config. It has to be per environment, because a top-level value is overridden by the plugin on client and never reaches ssr:

const scan = { rolldownOptions: { transform: { jsx: { runtime: 'classic' as const } } } }

export default defineConfig({
  environments: {
    client: { optimizeDeps: scan },
    ssr: { optimizeDeps: scan },
  },
})
Lingua principale
TypeScript
Stelle
520
Fork
70
Merge medio
21h 42m
PR unite (30g)
36

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di solidjs/solid-vite-plugin

Tutte le issue di solidjs/solid-vite-plugin

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.