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

Static output drops query parameters from useRouter().url after hydration

オープン
  • 何か問題がありますか？
#449 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

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

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

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
66/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
react, typescript, vite
領域
frontend

調査の方向性

Start by locating the React adapter's RouteResource and the router facade that compares the browser URL with pageData.url; the report identifies this as the suspected failure point. Reproduce with a static build and the provided /ssg?foo=bar#baz URL, then check the router's query string and searchParams after hydration. Done means the pathname still selects the static page while the router exposes the visitor's query parameters.

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

説明

Description

In a fully static React Pages deployment, useRouter().url omits the visitor's query parameters, even though they remain in the browser address bar.

Versions:

Live reproduction

https://query-bug.yangshun.workers.dev/ssg?foo=bar#baz

After successful hydration, the page renders:

{
  "href": "https://query-bug.yangshun.workers.dev/ssg",
  "pathname": "/ssg",
  "search": "",
  "searchParams": [],
  "hash": "#baz"
}

The browser URL still contains ?foo=bar. There are no browser warnings or errors.

Steps to reproduce
  1. Configure a React Pages app for static output:
// void.config.ts
import { defineConfig } from 'void/config';

export default defineConfig({
  target: 'cloudflare',
  output: 'static',
});
  1. Add a page that displays the router's query string:
// pages/ssg.tsx
import { useRouter } from '@void/react';

export default function Ssg() {
  const router = useRouter();
  return <pre>{router.url.search || '(empty)'}</pre>;
}
  1. Ensure there are no pages with prerender = false or other server features.
  2. Deploy using npx void deploy. The CLI identifies the deployment as Static Site.
  3. Open /ssg?foo=bar.

This also reproduces when serving the generated static files locally:

pnpm exec void prepare
pnpm exec vite build
python3 -m http.server 4173 --directory dist/client

With Python's static server, open http://localhost:4173/ssg.html?foo=bar#baz.

Expected

router.url.search is "?foo=bar", and router.url.searchParams.get('foo') returns "bar".

Actual

router.url.search is "", and router.url.searchParams is empty.

Framework comparison

With Void and all adapters at 1.1.11, Vue 3.5.44, Svelte 5.57.2, and Solid 1.9.17 all preserve ?foo=bar and #123 after hydration in local static production builds, without browser errors. Only React loses the query string; React was also verified on Cloudflare. This appears React-specific.

Suspected cause

The prerendered __VOID_PAGE_DATA__ payload contains "url":"/ssg".

In the React adapter's RouteResource, the router facade compares the browser's pathname plus search against pageData.url. Because /ssg?foo=bar differs from /ssg, it falls back to the build-time URL, losing the query parameters.

Selecting static files by pathname is correct, but the client router should still expose the visitor's query parameters.

主要言語
TypeScript
スター
402
フォーク
32
平均マージ
13時間 14分
マージ済み PR（30日）
73

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

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

voidzero-dev/void のほかの issue

voidzero-dev/void の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

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

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