Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Start mode dev: server component pages fail to serialize (seroval "[object Object] cannot be parsed")

オープン
#394 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

まだ誰も着手していません。

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
65/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
活発
技術スタック
typescript, vite

調査の方向性

Start with the Vite configuration and the server-component route in src/routes/index.tsx, then reproduce with pnpm dev and curl http://localhost:5173/. Compare the dev SSR module graph with the working vite build && node dist/server/node.js path, focusing on seroval and seroval-plugins externalization and the noExternal workaround. Done means the dev response contains the expected main element without the seroval parse error.

索引モデルが issue の本文から書いたものです。

説明

[Opus-5.5] On behalf of Elies

In SSR start mode with serverFunctions: { components: true }, a file route whose page is a server component renders an empty document under vite dev. The server logs SSR_RENDER_ERROR_CONTAINED with a seroval parse error. The production build of the same app renders the page correctly.

Versions: solid-js and @solidjs/web 2.0.0-rc.13, @solidjs/vite-plugin 3.0.0-next.47, @solidjs/router 2.0.0-next.35, filesystem-routing 0.4.0, vite 8.3.2, seroval and seroval-plugins 1.6.8 (one copy installed), Node 24.18, pnpm 10.32, Linux.

Minimal reproduction:

// vite.config.ts
import { defineConfig } from 'vite';
import solid from '@solidjs/vite-plugin';
import { fileRoutes } from 'filesystem-routing/vite';

export default defineConfig({
  plugins: [
    solid({ start: { node: true }, ssr: true, serverFunctions: { components: true }, extensions: ['.jsx', '.tsx'] }),
    fileRoutes({ serverComponents: true }),
  ],
});
// src/App.tsx
import { pageRoutes } from 'virtual:file-routes';
import { createRouter } from '@solidjs/router';
import { fileRoutes } from '@solidjs/router/fs';

const Router = createRouter({ routes: fileRoutes(pageRoutes) });

export default function App() {
  return <Router>{(props) => props.children}</Router>;
}
// src/routes/index.tsx
export default async function Home() {
  'use server';
  return () => <main>Hello from a server component</main>;
}

Steps: pnpm dev, then curl http://localhost:5173/.

Expected: a document containing <main>Hello from a server component</main>, as vite build && node dist/server/node.js produces.

Actual: the response body is only <!DOCTYPE html>, and the dev server logs:

[SSR_RENDER_ERROR_CONTAINED] Render error outside any boundary — the request failed: Error: Seroval caught an error during the parsing process.
The value [object Object] of type "object" cannot be parsed/serialized.
  cause: SerovalUnsupportedTypeError
    at parseObjectPhase2 (seroval/dist/dev/index.js)
    at Object.stream (seroval-plugins/dist/dev/web-*.js)   <- ReadableStreamPlugin
    ...
    at armDocumentLiveHoles (@solidjs/web/frames/dist/server.dev.js)

The failing call is ctx.serialize("sc:live", new ReadableStream(...)) in armDocumentLiveHoles. ReadableStreamPlugin then fails to parse its READABLE_STREAM_FACTORY reference.

Workaround: inlining seroval in the SSR environment fixes dev:

ssr: { noExternal: ['seroval', 'seroval-plugins'] },

That suggests the dev SSR graph gets two seroval module instances. solid-js and @solidjs/web are added to noExternal, while seroval and seroval-plugins stay external, so the reference registered by one instance isn't found by the other. I haven't confirmed that beyond the workaround.

主要言語
TypeScript
スター
522
フォーク
72
平均マージ
20時間 1分
マージ済み PR(30日)
31

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

solidjs/solid-vite-plugin のほかの issue

solidjs/solid-vite-plugin の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。