React中使用Yup表单验证库出现TypeError: yup__WEBPACK_IMPORTED_MODULE_0__ is not a function问题求助

嘿，我能帮你搞定这个问题！你遇到的TypeError: yup__WEBPACK_IMPORTED_MODULE_0__ is not a function错误，核心原因是调用Yup验证方法的方式不对，咱们一步步来修正：

错误根源 #

你代码里写了yup()，但实际上yup是一个包含各类验证方法的对象，不是可执行的函数。直接调用yup()会触发这个类型错误，而且这和你有没有运行表单处理函数无关——页面加载时解析这段代码就会报错。另外，Yup里也没有isRequired()这个方法，正确的方法名是required()。

修正后的代码 #

把yup()改成直接使用yup对象链式调用方法，同时修正验证方法名：

import * as yup from "yup";
export const detailsSchema = yup.object().shape({
  cheeseType: yup
    .string()
    .required() // 也可以传入自定义提示文字，比如.required("请选择奶酪类型")
});

额外排查建议 #

• 简化导入方式：如果你用的是较新版本的Yup，也可以用默认导入，代码更简洁：

  import yup from "yup";
  

• 重新安装依赖：你已经删了node_modules，可以再执行npm install（或yarn install）确保依赖完全安装，有时候缓存也可能导致奇怪的问题，也可以加上--force参数强制重新安装。

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