[GH-ISSUE #5590] Failed to fetch dynamically imported module #18923

Closed
opened 2026-04-15 17:39:08 -05:00 by GiteaMirror · 3 comments
Owner

Originally created by @Rvvvv1 on GitHub (Oct 26, 2025).
Original GitHub issue: https://github.com/better-auth/better-auth/issues/5590

Is this suited for github?

  • Yes, this is suited for github

To Reproduce

我的项目架构为server:honojs dirzzle better-auth client:vite react tanstack-router
1.我通过bunx create-tsrouter-app@latest 构建客户端 我的后端配置是按照better-auth hono来的 测试是没问题的

2当我想在客户端使用 const { data: session } = authClient.useSession()报错 Failed to fetch dynamically imported module: http://localhost:5173/src/routes/index.tsx?tsr-split=component
网络请求:http://localhost:5173/node_modules/.vite/deps/better-auth_react.js?v=71f59f83 报错504
我的后端地址是http://localhost:3000。前端是http://localhost:5173/ 我已经设置了vite 代理

Image

代码调用:

Image Image Image

Current vs. Expected behavior

The page cannot be displayed properly

What version of Better Auth are you using?

1.3.4

System info

{
  "system": {
    "platform": "darwin",
    "arch": "arm64",
    "version": "Darwin Kernel Version 24.6.0: Mon Jul 14 11:30:40 PDT 2025; root:xnu-11417.140.69~1/RELEASE_ARM64_T8132",
    "release": "24.6.0",
    "cpuCount": 10,
    "cpuModel": "Apple M4",
    "totalMemory": "24.00 GB",
    "freeMemory": "0.09 GB"
  },
  "node": {
    "version": "v24.9.0",
    "env": "development"
  },
  "packageManager": {
    "name": "bun",
    "version": "1.3.0"
  },
  "frameworks": [
    {
      "name": "hono",
      "version": "^4.10.3"
    }
  ],
  "databases": [
    {
      "name": "pg",
      "version": "^8.16.3"
    },
    {
      "name": "drizzle",
      "version": "^0.44.7"
    }
  ],
  "betterAuth": {
    "version": "^1.3.4",
    "config": null
  }
}

Which area(s) are affected? (Select all that apply)

Client

Auth config (if applicable)

import { betterAuth } from "better-auth"
export const auth = betterAuth({
  emailAndPassword: {  
    enabled: true
  },
});

Additional context

client-package.json
{
"name": "client",
"private": true,
"type": "module",
"scripts": {
"dev": "vite --port 5173",
"build": "vite build && tsc",
"serve": "vite preview",
"test": "vitest run",
"lint": "eslint",
"format": "prettier",
"check": "prettier --write . && eslint --fix"
},
"dependencies": {
"@tailwindcss/vite": "^4.0.6",
"@tanstack/react-devtools": "^0.7.0",
"@tanstack/react-query": "^5.66.5",
"@tanstack/react-query-devtools": "^5.84.2",
"@tanstack/react-router": "^1.132.0",
"@tanstack/react-router-devtools": "^1.132.0",
"@tanstack/router-plugin": "^1.132.0",
"lucide-react": "^0.545.0",
"react": "^19.2.0",
"react-dom": "^19.2.0",
"tailwindcss": "^4.0.6"
},
"devDependencies": {
"@tanstack/eslint-config": "^0.3.0",
"@testing-library/dom": "^10.4.0",
"@testing-library/react": "^16.2.0",
"@types/node": "^22.10.2",
"@types/react": "^19.2.0",
"@types/react-dom": "^19.2.0",
"@vitejs/plugin-react": "^5.0.4",
"jsdom": "^27.0.0",
"prettier": "^3.5.3",
"typescript": "^5.7.2",
"vite": "^7.1.7",
"vitest": "^3.0.5",
"web-vitals": "^5.1.0"
}
}

hono-package.json
{
"name": "shadcn-admin",
"scripts": {
"dev": "concurrently "bun client" "bun server"",
"client": "cd client && bun dev",
"server": "bun run --hot server/index.ts",
"db:push": "drizzle-kit push",
"db:generate": "drizzle-kit generate",
"db:migrate": "drizzle-kit migrate",
"db:studio": "drizzle-kit studio"
},
"dependencies": {
"better-auth": "^1.3.4",
"drizzle-orm": "^0.44.7",
"hono": "^4.10.3",
"pg": "^8.16.3"
},
"devDependencies": {
"@types/bun": "latest",
"@types/pg": "^8.15.5",
"concurrently": "^9.2.1",
"drizzle-kit": "^0.31.5"
}
}

Originally created by @Rvvvv1 on GitHub (Oct 26, 2025). Original GitHub issue: https://github.com/better-auth/better-auth/issues/5590 ### Is this suited for github? - [ ] Yes, this is suited for github ### To Reproduce 我的项目架构为server:honojs dirzzle better-auth client:vite react tanstack-router 1.我通过bunx create-tsrouter-app@latest 构建客户端 我的后端配置是按照better-auth hono来的 测试是没问题的 2当我想在客户端使用 const { data: session } = authClient.useSession()报错 Failed to fetch dynamically imported module: http://localhost:5173/src/routes/index.tsx?tsr-split=component 网络请求:http://localhost:5173/node_modules/.vite/deps/better-auth_react.js?v=71f59f83 报错504 我的后端地址是http://localhost:3000。前端是http://localhost:5173/ 我已经设置了vite 代理 <img width="2226" height="498" alt="Image" src="https://github.com/user-attachments/assets/7cd56102-ae27-48c1-9e4b-81c28f72c6dd" /> 代码调用: <img width="2870" height="1684" alt="Image" src="https://github.com/user-attachments/assets/f4195ab2-8783-4b03-8761-0e47687d3fda" /> <img width="2910" height="1524" alt="Image" src="https://github.com/user-attachments/assets/250682fd-a9e6-4107-a0da-97d338600ba3" /> <img width="1220" height="1464" alt="Image" src="https://github.com/user-attachments/assets/283a127b-b7ec-41b2-a1e1-fe5150e7b46f" /> ### Current vs. Expected behavior The page cannot be displayed properly ### What version of Better Auth are you using? 1.3.4 ### System info ```bash { "system": { "platform": "darwin", "arch": "arm64", "version": "Darwin Kernel Version 24.6.0: Mon Jul 14 11:30:40 PDT 2025; root:xnu-11417.140.69~1/RELEASE_ARM64_T8132", "release": "24.6.0", "cpuCount": 10, "cpuModel": "Apple M4", "totalMemory": "24.00 GB", "freeMemory": "0.09 GB" }, "node": { "version": "v24.9.0", "env": "development" }, "packageManager": { "name": "bun", "version": "1.3.0" }, "frameworks": [ { "name": "hono", "version": "^4.10.3" } ], "databases": [ { "name": "pg", "version": "^8.16.3" }, { "name": "drizzle", "version": "^0.44.7" } ], "betterAuth": { "version": "^1.3.4", "config": null } } ``` ### Which area(s) are affected? (Select all that apply) Client ### Auth config (if applicable) ```typescript import { betterAuth } from "better-auth" export const auth = betterAuth({ emailAndPassword: { enabled: true }, }); ``` ### Additional context client-package.json { "name": "client", "private": true, "type": "module", "scripts": { "dev": "vite --port 5173", "build": "vite build && tsc", "serve": "vite preview", "test": "vitest run", "lint": "eslint", "format": "prettier", "check": "prettier --write . && eslint --fix" }, "dependencies": { "@tailwindcss/vite": "^4.0.6", "@tanstack/react-devtools": "^0.7.0", "@tanstack/react-query": "^5.66.5", "@tanstack/react-query-devtools": "^5.84.2", "@tanstack/react-router": "^1.132.0", "@tanstack/react-router-devtools": "^1.132.0", "@tanstack/router-plugin": "^1.132.0", "lucide-react": "^0.545.0", "react": "^19.2.0", "react-dom": "^19.2.0", "tailwindcss": "^4.0.6" }, "devDependencies": { "@tanstack/eslint-config": "^0.3.0", "@testing-library/dom": "^10.4.0", "@testing-library/react": "^16.2.0", "@types/node": "^22.10.2", "@types/react": "^19.2.0", "@types/react-dom": "^19.2.0", "@vitejs/plugin-react": "^5.0.4", "jsdom": "^27.0.0", "prettier": "^3.5.3", "typescript": "^5.7.2", "vite": "^7.1.7", "vitest": "^3.0.5", "web-vitals": "^5.1.0" } } hono-package.json { "name": "shadcn-admin", "scripts": { "dev": "concurrently \"bun client\" \"bun server\"", "client": "cd client && bun dev", "server": "bun run --hot server/index.ts", "db:push": "drizzle-kit push", "db:generate": "drizzle-kit generate", "db:migrate": "drizzle-kit migrate", "db:studio": "drizzle-kit studio" }, "dependencies": { "better-auth": "^1.3.4", "drizzle-orm": "^0.44.7", "hono": "^4.10.3", "pg": "^8.16.3" }, "devDependencies": { "@types/bun": "latest", "@types/pg": "^8.15.5", "concurrently": "^9.2.1", "drizzle-kit": "^0.31.5" } }
GiteaMirror added the locked label 2026-04-15 17:39:08 -05:00
Author
Owner

@dosubot[bot] commented on GitHub (Oct 26, 2025):

Hi @Rvvvv1! I'm Dosu and I’m helping the better-auth team.

你的问题是 Vite 在客户端构建时,better-auth/react 依赖没有被正确解析,导致 504 和 “Failed to fetch dynamically imported module” 错误。这通常有两个主要原因:

  1. better-auth 没有作为依赖安装在 client 包下
    你需要在 client 目录下执行:

    bun add better-auth
    

    npm install better-auth
    

    better-auth/react 实际上是 better-auth 包的一个子路径导出,不能单独安装,必须在 client 里有 better-auth 依赖,否则 Vite 无法优化和预编译它。

  2. Vite 依赖优化导致服务端代码被打包进客户端
    你的 better-auth 版本是 1.3.4,这个问题在 1.3.9 之前的版本很常见。官方推荐的解决办法是:
    vite.config.ts 里加上

    optimizeDeps: {
      exclude: ["better-auth"],
    }
    

    这样可以避免 Vite 把 server-only 代码打包进浏览器端,防止运行时崩溃。参考

  3. 确保只在 client 代码中用 import { createAuthClient } from "better-auth/react"
    不要直接从 "better-auth" 或服务端的 auth.ts 导入任何内容到 client。

  4. React 依赖必须在 client 里声明
    你的 client package.json 已经有 "react": "^19.2.0",这没问题,但 better-auth 依赖 React 作为 peerDependency,必须保证 node_modules 里能解析到 react。

  5. 建议升级 better-auth 到 >=1.3.9
    这样可以彻底避免 Vite 优化相关的坑,升级后可以去掉 optimizeDeps.exclude 配置。参考

操作建议:

  1. 在 client 目录下安装 better-auth。
  2. 在 vite.config.ts 里加上 optimizeDeps.exclude 配置。
  3. 清理 node_modules 和 .vite 缓存,重新安装依赖并重启 dev server。
  4. 如果可以,升级 better-auth 到 1.3.9 或更高版本。

这些步骤可以解决绝大多数 Vite + better-auth/react 的动态导入和依赖解析问题。如果还有问题,可以贴下完整的 client 目录结构和 auth-client.ts 的内容。

To reply, just mention @dosu.


How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other  Chat with Dosu Join Discord Share on X

<!-- gh-comment-id:3448331814 --> @dosubot[bot] commented on GitHub (Oct 26, 2025): <!-- Greeting --> Hi @Rvvvv1! I'm [Dosu](https://go.dosu.dev/dosubot) and I’m helping the better-auth team. <!-- Answer --> 你的问题是 Vite 在客户端构建时,better-auth/react 依赖没有被正确解析,导致 504 和 “Failed to fetch dynamically imported module” 错误。这通常有两个主要原因: 1. **better-auth 没有作为依赖安装在 client 包下** 你需要在 client 目录下执行: ```bash bun add better-auth ``` 或 ```bash npm install better-auth ``` better-auth/react 实际上是 better-auth 包的一个子路径导出,不能单独安装,必须在 client 里有 better-auth 依赖,否则 Vite 无法优化和预编译它。 2. **Vite 依赖优化导致服务端代码被打包进客户端** 你的 better-auth 版本是 1.3.4,这个问题在 1.3.9 之前的版本很常见。官方推荐的解决办法是: 在 `vite.config.ts` 里加上 ```ts optimizeDeps: { exclude: ["better-auth"], } ``` 这样可以避免 Vite 把 server-only 代码打包进浏览器端,防止运行时崩溃。[参考](https://github.com/better-auth/better-auth/issues/4457) 3. **确保只在 client 代码中用 `import { createAuthClient } from "better-auth/react"`** 不要直接从 "better-auth" 或服务端的 auth.ts 导入任何内容到 client。 4. **React 依赖必须在 client 里声明** 你的 client package.json 已经有 `"react": "^19.2.0"`,这没问题,但 better-auth 依赖 React 作为 peerDependency,必须保证 node_modules 里能解析到 react。 5. **建议升级 better-auth 到 >=1.3.9** 这样可以彻底避免 Vite 优化相关的坑,升级后可以去掉 optimizeDeps.exclude 配置。[参考](https://github.com/better-auth/better-auth/issues/4457) **操作建议:** 1. 在 client 目录下安装 better-auth。 2. 在 vite.config.ts 里加上 optimizeDeps.exclude 配置。 3. 清理 node_modules 和 .vite 缓存,重新安装依赖并重启 dev server。 4. 如果可以,升级 better-auth 到 1.3.9 或更高版本。 这些步骤可以解决绝大多数 Vite + better-auth/react 的动态导入和依赖解析问题。如果还有问题,可以贴下完整的 client 目录结构和 auth-client.ts 的内容。 <!-- Dosu Comment Footer --> *To reply, just mention [@dosu](https://go.dosu.dev/dosubot).* --- <sup>How did I do? [Good](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=great_response) | [Irrelevant](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=irrelevant_answer) | [Incorrect](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=incorrect_sources) | [Verbose](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=too_verbose) | [Hallucination](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=hallucination) | [Report 🐛](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=bug_report) | [Other](https://app.dosu.dev/response-feedback/6dc1335f-9405-4a05-8e30-1bfe90cb3b02?feedback_type=other)</sup>&nbsp;&nbsp;[![Chat with Dosu](https://dosu.dev/dosu-chat-badge.svg)](https://app.dosu.dev/cdda13d9-dd27-4d31-b09a-5d8bec92de21/ask?utm_source=github)&nbsp;[![Join Discord](https://img.shields.io/badge/join-5865F2?logo=discord&logoColor=white&label=)](https://go.dosu.dev/discord-bot)&nbsp;[![Share on X](https://img.shields.io/badge/X-share-black)](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/better-auth/better-auth/issues/5590)
Author
Owner

@Rvvvv1 commented on GitHub (Oct 26, 2025):

@dosu Thank you for your answer, but I seem to have noticed that the problem is with the client "@ vitejs/plugin react": "^ 5.0.4", which is too high. I downgraded it to "@ vitejs/plugin react": "^ 4.3.4", and it will work normally

<!-- gh-comment-id:3448441280 --> @Rvvvv1 commented on GitHub (Oct 26, 2025): [@dosu](https://go.dosu.dev/dosubot) Thank you for your answer, but I seem to have noticed that the problem is with the client "@ vitejs/plugin react": "^ 5.0.4", which is too high. I downgraded it to "@ vitejs/plugin react": "^ 4.3.4", and it will work normally
Author
Owner

@ping-maxwell commented on GitHub (Jan 10, 2026):

Hello it seems you have solved your issue with the version issue. I'll be closing this for now.

<!-- gh-comment-id:3732897712 --> @ping-maxwell commented on GitHub (Jan 10, 2026): Hello it seems you have solved your issue with the version issue. I'll be closing this for now.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/better-auth#18923