Next.js 14 + Mongoose TypeError：无法读取undefined的User属性

版本信息 #

• Next.js 14.1
• React 18

问题场景 #

开发用户资料更新模块，支持修改用户名、姓名和头像，用shadcn构建表单组件PersonalInfo.tsx。目前fetchUser动作可正常获取用户信息并预填表单，但调用updateUser动作时，Mongoose的User模型触发TypeError：Cannot read properties of undefined (reading 'User')。

相关代码结构：

• components/forms/PersonalInfo.tsx：客户端组件，包含提交表单调用updateUser
• app/(root)/profile/page.tsx：服务端页面，获取用户数据并渲染表单
• lib/models/user.model.ts：定义Mongoose的User模型

可能的原因 #

• 模型导出/导入不匹配：检查user.model.ts的导出方式（默认导出/命名导出），以及updateUser中对应的导入方式是否一致。比如模型用export default User，但导入时用了import { User } from '...'，会导致User变量为undefined。
• 客户端直接调用服务端模型：PersonalInfo.tsx是客户端组件，如果updateUser直接在客户端代码中引入并使用Mongoose的User模型，会触发错误——Mongoose模型只能在服务端环境运行，不能在浏览器中执行。需将updateUser逻辑放到服务端API路由（如app/api/user/update/route.ts），客户端通过fetch调用该API。
• Mongoose连接未初始化：updateUser执行时，Mongoose可能还未完成数据库连接，导致模型未被正确注册。确保调用模型前已通过mongoose.connect()完成连接，比如在单独的数据库连接文件中初始化，并在updateUser执行前加载该文件。
• 模型加载顺序问题：如果updateUser所在文件在Mongoose连接建立前就加载了User模型，会导致模型未初始化。需保证模型的导入和使用在连接完成之后进行。
• 变量拼写错误：检查updateUser中引用User模型的变量名是否拼写正确，比如误写为小写user或其他错误名称。

内容的提问来源于stack exchange，提问作者randomdevph