🔥

Cloudflare + RemixでInvalid state: Controller is already closed発生時のメモ

2024/10/08に公開

Cloudflare

Remix

tech

Cloudflare Workers にログ出力機能を試した際に発生したエラーについてのメモです。
Builder Day 2024 の発表内容はこちら

発生したエラー

以下の記事を参考に Remix のプロジェクトを作成後、npm run dev でローカル環境で起動したところエラーが発生しました。

TypeError [ERR_INVALID_STATE]: Invalid state: Controller is already closed

解決法

インストール時の@remix-run のマイナーバージョン(2.12.1)が原因の様です。
package.json の @remix-run のバージョンを "^2.12.0" から "2.12.0" に修正することでエラーが解消しました。

package.json

{
  "dependencies": {
+   "@remix-run/cloudflare": "2.12.0",
+   "@remix-run/cloudflare-pages": "2.12.0",
+   "@remix-run/react": "2.12.0",
-   "@remix-run/cloudflare": "^2.12.0",
-   "@remix-run/cloudflare-pages": "^2.12.0",
-   "@remix-run/react": "^2.12.0",
    "isbot": "^4.1.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@cloudflare/workers-types": "^4.20241004.0",
+   "@remix-run/dev": "2.12.0",
-   "@remix-run/dev": "^2.12.0",
    "@types/react": "^18.2.20",
    "@types/react-dom": "^18.2.7",
    "@typescript-eslint/eslint-plugin": "^6.7.4",
    "@typescript-eslint/parser": "^6.7.4",
    "autoprefixer": "^10.4.19",
    "eslint": "^8.38.0",
    "eslint-import-resolver-typescript": "^3.6.1",
    "eslint-plugin-import": "^2.28.1",
    "eslint-plugin-jsx-a11y": "^6.7.1",
    "eslint-plugin-react": "^7.33.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "postcss": "^8.4.38",
    "tailwindcss": "^3.4.4",
    "typescript": "^5.1.6",
    "vite": "^5.1.0",
    "vite-tsconfig-paths": "^4.2.1",
    "wrangler": "^3.80.0"
  },
}

発生したエラー

解決法

Discussion