TanStack Start を Cloudflare Workers で試す
TanStack Start を Cloudflare Workers で動かしてみたので、その手順と遭遇したエラーについてメモがてら記事にしておこうと思います。
Getting Started
プロジェクトを作成する
以下のコマンドでプロジェクトを作成します。
- git の管理をするか
- デプロイするか
などが聞かれます。
pnpm create cloudflare@latest tanstack-start-sample --framework=tanstack-start
開発環境を立ち上げてみる
ローカルでの確認
以下のコマンドを実行すると localhost:3000 で立ち上がるはずです。
pnpm run dev
エラーへの遭遇と対処
実際に pnpm run dev してみたところ、以下のようなエラーに遭遇しました。
❯ pnpm run dev
> tanstack-start-sample@ dev /Users/xxx/tanstack-start-sample
> vite dev --port 3000
failed to load config from /Users/xxx/tanstack-start-sample/vite.config.ts
error when starting dev server:
Error: The installed version of Wrangler (4.54.0) does not satisfy the peer dependency required by @cloudflare/vite-plugin (^4.56.0).
Please install wrangler@^4.56.0.
at assertWranglerVersion (file:///Users/xxx/tanstack-start-sample/node_modules/.pnpm/@cloudflare+vite-plugin@1.19.0_vite@7.3.0_@types+node@22.19.3_jiti@2.6.1_lightningcss@1_a6777e4ff595302fd3757f274d550037/node_modules/@cloudflare/vite-plugin/dist/index.mjs:1492:77)
at async file:///Users/xxx/tanstack-start-sample/node_modules/.pnpm/@cloudflare+vite-plugin@1.19.0_vite@7.3.0_@types+node@22.19.3_jiti@2.6.1_lightningcss@1_a6777e4ff595302fd3757f274d550037/node_modules/@cloudflare/vite-plugin/dist/index.mjs:17732:1
ELIFECYCLE Command failed with exit code 1.
どうやら create cloudflare (C3) コマンドで作成されると "wrangler": "^4.54.0" が指定されるようですが、これではバージョンが古くエラーになるようです。
package.json の wrangler のバージョンを "^4.56.0" に変更して pnpm i を実行し直しました。
改めて pnpm run dev を実行したところ、無事に立ち上げることができました。
エラーの原因について
以下を確認する限り、最新の Wrangler がインストールされそうなものですが、npm 側のキャッシュなどが影響している可能性がありそうです。
Deploy してみる
以下のコマンドを実行するとアカウント選択を求められ、デプロイが開始されます（wrangler login していなければログインが求められます）。
pnpm run deploy
成功すれば以下のようなドメインが表示されるはずです。
https://{プロジェクト名}.{アカウント毎のサブドメイン}.workers.dev/
まとめ
簡単ですが、これで TanStack Start を Cloudflare Workers にデプロイすることができました。なぞのエラーに遭遇しましたが、簡単にデプロイまで出来てしまえるのは Cloudflare の良い点ですね。
これを雛形にして自由にご自身の Web アプリを開発してみてください！
Discussion