TanStack / TanStack/cli

[Bug] --router-only main.tsx ignores getRouter() from router.tsx (router.tsx becomes dead code + duplicate Register declaration)

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

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

主要言語
TypeScript
スター
1.3k
フォーク
185
平均マージ
18時間 45分
マージ済み PR(30日)
2

説明

Which project does this relate to?

Create Tanstack App

Describe the bug

When scaffolding a Router-only SPA (create --router-only), the generated src/router.tsx exports a getRouter() factory, but the generated src/main.tsx does not use it. Instead, main.tsx builds its own router inline with createRouter(...).

As a result:

  1. router.tsx / getRouter() is dead code - nothing imports it anywhere in a --router-only project.
  2. The declare module '@tanstack/react-router' { interface Register { ... } } block is duplicated in both main.tsx (router: typeof router) and router.tsx (router: ReturnType<typeof getRouter>).

In the default (TanStack Start) mode this is fine because Start consumes getRouter() from router.tsx as the entry, and main.tsx is not generated. But in --router-only mode the two files diverge and router.tsx is left orphaned.

Your Example Website or App

pnpx @tanstack/cli create --router-only

Steps to Reproduce the Bug or Issue
  1. pnpx @tanstack/cli create --router-only
  2. Open src/main.tsx and src/router.tsx
  3. Grep the project for getRouter -> only defined in router.tsx, never imported
    (No StackBlitz needed - this is reproducible purely from the CLI output.)
Expected behavior

In --router-only mode, main.tsx should import and use getRouter() from router.tsx, and the Register module augmentation should live in a single place (router.tsx). Something like:

import ReactDOM from 'react-dom/client'
import { RouterProvider } from '@tanstack/react-router'
import { getRouter } from './router'

const router = getRouter()

const rootElement = document.getElementById('app')!

if (!rootElement.innerHTML) {
  const root = ReactDOM.createRoot(rootElement)
  root.render(<RouterProvider router={router} />)
}

This keeps a single source of truth for router configuration across both Start and Router-only modes, removes the dead getRouter(), and removes the duplicate Register declaration.

Screenshots or Videos

No response

Platform
  • OS: macOS
  • @tanstack/cli: 0.69.5
Additional context
  • packages/create/src/frameworks/react/project/base/src/main.tsx.ejs
  • Line 1: <% if (!routerOnly) { ignoreFile() } %> -> only emitted for router-only
  • Lines 6-16: creates its own router + declares Register instead of importing getRouter
  • packages/create/src/frameworks/react/project/base/src/router.tsx.ejs
  • No ignoreFile() guard -> always emitted, exports getRouter() + declares Register

The Solid templates have an identical structure:

  • packages/create/src/frameworks/solid/project/base/src/main.tsx.ejs
  • packages/create/src/frameworks/solid/project/base/src/router.tsx.ejs

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

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

調査の方向性

packages/create/src/frameworks/react/project/base/src/main.tsx.ejs と router.tsx.ejs から始め、対応する Solid のテンプレートと比較します。CLI を --router-only で実行し、生成されたファイルを確認します。完了条件は、main.tsx が getRouter() を使用し、router の設定と Register 宣言が生成されたプロジェクト内で重複していないことです。

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

評価

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

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

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