Repository navigation
vinextを導入する(OpenNextと併用可能な形で追加) - #72
Conversation
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
cateiru-com | 8b31782 | Commit Preview URL Branch Preview URL |
Nov 06 2026, 10:28 AM |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 8c3e5db237
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
cateiru
left a comment
There was a problem hiding this comment.
レビューまとめ
vinext の導入と本番経路の切り替え方針は、PR 説明・検証内容ともに丁寧で分かりやすいです。Codex の P1/P2 指摘への対応(enable_weak_ref の追加、Workers Builds 側の設定変更)も確認しました。マージ前に検討してほしい点を以下にまとめます。
1. CI と VRT が本番経路(vinext)を検証していない(重要)
.github/workflows/ci.ymlのciジョブはpnpm build(next build)しか実行しておらず、build:vinextは CI で実行されません。playwright.vrt.config.tsの webServer はpnpm build && pnpm start(next start)で起動しています。そのため VRT の「変化なし 4 件」は Next.js 本体でのレンダリング結果 の比較で、本番の vinext 出力が見た目上変わっていないことの保証にはなっていません。- 特に CSS Modules のクラス名の生成方法は
vite.config.tsのgenerateScopedNameによって Next.js と異なります。CSS 周りの差分は vinext 側でしか出ない可能性があります。
本番を vinext に一本化するなら、次の対応をおすすめします。
ciジョブにpnpm build:vinextを追加する- VRT の webServer を
pnpm build:vinext && pnpm start:vinext相当に切り替える(少なくとも vinext 側でも撮る)
2. ドキュメントが OpenNext 前提のまま
CLAUDE.md の「デプロイ先: Cloudflare Workers(@opennextjs/cloudflare 経由)」「デプロイフロー」と、README.md の npm run preview は OpenNext 前提の記述のままです。本番経路が変わるので、vinext 用のコマンドと、Workers Builds の設定(ビルド / デプロイ / バージョンコマンド)を追記しておくと、あとで迷わずに済みます。
3. OpenNext 経路の扱い(フォローアップで可)
preview / deploy スクリプト、open-next.config.ts、@opennextjs/cloudflare(latest 指定)が残っています。ただ wrangler.jsonc の main が vinext 向けに変わったため、Codex の指摘どおりこれらはもう正しく動かないはずです(未検証です)。「legacy として残す」なら動かないことを明記し、不要なら別 PR で削除するのがよいと思います。あわせて、next-env.d.ts がビルドのたびに書き換わる問題も、OpenNext/Next ビルドの経路を整理すれば解消しやすくなります。
4. 細かい点(インラインコメント参照)
react/react-domの宣言範囲が vinext の peer 要件(^19.3.1)より低い。Renovate のグループにreact-server-dom-webpackが入っていないwrangler.jsoncのassets.directoryが.open-next/assetsのまま- 使っていない
imagesバインディング /imagesOptimizer()
Generated by Claude Code
| "react": "^19.1.0", | ||
| "react-dom": "^19.1.0" | ||
| "react-dom": "^19.1.0", | ||
| "react-server-dom-webpack": "^19.3.1", |
There was a problem hiding this comment.
vinext@1.4.2 と react-server-dom-webpack@19.3.1 は peerDependencies で react / react-dom に ^19.3.1 を要求しています(pnpm-lock.yaml 参照)。一方 package.json の宣言は ^19.1.0 のままです。今の lockfile は 19.3.1 に解決されているので実害はありませんが、宣言上の下限が実際の要件より低くなっています。react / react-dom も ^19.3.1 に揃えておくと意図が明確になります。
あわせて renovate.json の "React" グループに react-server-dom-webpack が入っていません。RSC ランタイム(react-server-dom-*)は基本的に react と同じバージョンで使う前提なので、別々の PR で上がるとバージョンがずれるおそれがあります(推測を含みます。ずれたときの具体的な壊れ方は未確認です)。グループに追加しておくのがおすすめです。vinext 関連(vinext, @vinext/*, vite, @vitejs/plugin-rsc, @cloudflare/vite-plugin)も、まとめて上げるグループを作っておくと保守しやすいと思います。
Generated by Claude Code
There was a problem hiding this comment.
Addressed in a4350c9: bumped the declared ranges of react and react-dom to ^19.3.1 to match the peer requirement, and added react-server-dom-webpack to the React group in renovate.json.
| ], | ||
| "preview_urls": true, | ||
| "assets": { | ||
| "directory": ".open-next/assets", |
There was a problem hiding this comment.
main は vinext 向けに変わりましたが、assets.directory は .open-next/assets のままです。PR 説明のとおり、本番は build:vinext が生成する dist/server/wrangler.json(assets は ../client)を使うので、この値は実際には使われていないはずです。ただソース側の設定に OpenNext の出力パスが残っていると、あとで読んだときに混乱しやすいです。
本番経路を vinext に一本化する方針であれば、main と同じく vinext 前提の値に揃えるか、「vite build 時に上書きされる」旨を JSONC のコメントで残しておくとよいと思います。
Generated by Claude Code
There was a problem hiding this comment.
Addressed in b08402e: kept the value, and added a JSONC comment above assets noting that it is overwritten by the generated dist/server/wrangler.json at vite build time.
| } | ||
| ] | ||
| ], | ||
| "images": { "binding": "IMAGES" } |
There was a problem hiding this comment.
nit: vinext check の結果どおり、このサイトの next/* の import は next/link だけで、next/image は使っていません。images バインディング(IMAGES)と、vite.config.ts の imagesOptimizer() は init が自動で追加したものだと思います。現時点では不要なので、外しておくと構成がシンプルになり、Cloudflare Images バインディングへの依存も持たずに済みます。将来 next/image を使う予定があるなら、このままで問題ありません。
Generated by Claude Code
There was a problem hiding this comment.
Addressed in b08402e: removed the unused images binding from wrangler.jsonc and imagesOptimizer() from vite.config.ts, since next/image is not used. Verified that pnpm build:vinext passes and the generated config no longer contains the IMAGES binding.
|
レビューまとめへの対応です。
細かい点(react の宣言範囲、assets、images)には各インラインコメントへ返信しました。 |
VRT (reg-suit) 結果
|
cateiru
left a comment
There was a problem hiding this comment.
再レビュー(8b31782 時点)
前回の指摘への対応を確認しました。いずれも問題ありません。
| 前回の指摘 | 対応 | 確認結果 |
|---|---|---|
| CI / VRT が vinext を検証していない | 15ee14c | ✅ ci ジョブに pnpm build:vinext を追加。VRT の webServer は pnpm build:vinext && pnpm start:vinext --port に変更。CI・VRT ともに成功しています |
| ドキュメントが OpenNext 前提 | 8b31782 | ✅ CLAUDE.md / README.md に vinext のコマンドと Workers Builds の設定、OpenNext が legacy である旨を記載。Next.js 15 → 16 の表記も修正済み |
| OpenNext 経路が壊れる | 18572b7 | ✅ wrangler.opennext.jsonc(main: .open-next/worker.js)に分離し、preview / deploy の build・preview・deploy すべてに --config を指定 |
| react の宣言範囲 / Renovate | a4350c9 | ✅ ^19.3.1 に揃え、React グループに react-server-dom-webpack を追加 |
assets.directory |
b08402e | ✅ 上書きされる旨のコメントを追加 |
| 未使用の images | b08402e | ✅ バインディングと imagesOptimizer() を削除 |
特に VRT は、main のベースライン(Next.js でのスクリーンショット)と vinext のスクリーンショットを比べる形になりました。その結果が「差分あり 0 / 変化なし 4」なので、vinext に切り替えても見た目が変わらないことを確認できたと言えます。
残っている点(いずれも任意・別 PR で可)
- Renovate で vinext 関連(
vinext,@vinext/*,vite,@vitejs/plugin-rsc,@cloudflare/vite-plugin)をまとめて上げるグループはまだありません。@cloudflare/vite-pluginは既存の "Cloudflare" グループ(@cloudflare/*)に入るので、wranglerと一緒に上がります(peer 要件の関係でむしろ都合がよいはずです)。残りは個別の PR になるため、必要に応じて追加してください。 wrangler.jsoncとwrangler.opennext.jsoncでname/routes/cacheが重複しています。legacy 経路を削除するフォローアップまでの一時的な状態なので、このままで問題ないと思います。
マージしてよい状態だと思います 👍
Generated by Claude Code
関連: #71
概要
Cloudflare公式ガイド(2026-11-05更新)が Next.js on Workers の既定を OpenNext から vinext に変更したことを受け、vinext 1.4.2 を導入し、本番も vinext でデプロイする方針に切り替えます。
vinext init --platform=cloudflare --legacy-wrangler-cloudflare-initで導入しました。マージだけでは本番に反映されず、Cloudflare 側のビルド設定変更(後述)とセットです。互換性チェック結果
vinext checkの結果は 100% compatible(5 supported / 0 partial / 0 issues)でした。next/*の import はnext/linkのみで、完全サポート変更点
package.json:dev:vinext/build:vinext/start:vinext/deploy:vinextスクリプトと vinext 関連の依存を追加、"type": "module"を追加vite.config.ts: vinext init が生成したものを追加wrangler.jsonc:mainを.open-next/worker.jsからvinext/server/fetch-handlerに変更し、imagesバインディング(IMAGES)を追加。cache.enabledは init がfalseに変えていたため、従来どおりtrueに戻しています。あわせてcompatibility_flagsにenable_weak_refを追加(Codex レビュー P2 対応)postcss.config.js→postcss.config.cjsにリネーム("type": "module"化に伴う init の処理)next-env.d.ts: vinext の型拡張 import を追加(init の処理)wranglerを 4.153.0 → 4.156.2 に更新(@cloudflare/vite-pluginの peer 要件^4.156.1を満たすため)Cloudflare 側で必要な設定変更(Workers Builds)
現在の設定は OpenNext 前提(ビルド:
pnpm exec opennextjs-cloudflare build、デプロイ:npx wrangler deploy、バージョン:npx wrangler versions upload)のため、マージ前後に以下へ変更が必要です。build:vinextが生成するdist/server/wrangler.json(main: index.js、assets は../client)を使う形です。pnpm run build:vinextpnpm exec wrangler deploy --config dist/server/wrangler.jsonpnpm exec wrangler versions upload --config dist/server/wrangler.jsonCodex レビュー P1(共有
mainの変更で OpenNext の preview/deploy が壊れる)については、本番経路を vinext に一本化する方針のため、設定分割ではなくこの切り替えで対応します。OpenNext 用のpreview/deployスクリプトは残りますが、本番経路ではなくなります。検証結果
pnpm build:vinext(vite build): 成功。生成されたdist/server/wrangler.jsonにenable_weak_refが含まれることも確認pnpm start:vinext(wrangler dev で本番ビルドを起動):GET /→ 200、存在しないパス → 404(not-found ページ)を確認pnpm dev:vinext(vite dev):enable_weak_refの追加によりGET /→ 200 を確認(追加前はWeakRef is not definedで 500 でした)pnpm build(next build)成功、pnpm typecheck成功、pnpm check(biome)成功注意点
next-env.d.tsはnext buildと vinext build の双方が再生成し、形が異なります(vinext 側は型拡張 import を含みroot-params.d.tsを含まない)。最後に実行したビルドの形になります.open-next/が残っていると vinext build がそれを拾って失敗します(CI は毎回新規 checkout のため影響なし)