SyntaxError: Cannot use import statement outside a module

Hi, I am having this issue suddenly. I don’t know where this came from. My code was working last night but now I am having this error.

Server Error
SyntaxError: Cannot use import statement outside a module

This is my code…

const { register, handleSubmit, errors, setError } = useForm<LoginFormValues>(
    {
      resolver: yupResolver(loginValidationSchema),
      mode: "onTouched",
      reValidateMode: "onBlur",
    }
  );

Inside the form:

<form className="mt-10" onSubmit={handleSubmit(onSubmit)}>
            <InputTextField
              type="email"
              name="email"
              label="Email Address"
              error={errors.email?.message}
              placeholder="[e-mail]"
              register={register}
            />
            <div className="mt-6">
              <InputTextField
                type="password"
                name="password"
                label="Password"
                error={errors.password?.message}
                placeholder="Enter Your Password"
                register={register}
              />
            </div>

            <div className="mt-6">
              <button type="submit"
              >
                Log In
              </button>
            </div>
          </form>

I can’t recreate this error in the code sandbox. It’s showing me some other errors. I am so confused right now. BTW, I am using nextjs with typescript

[prumand]

I have the same issue. Downgrading to 1.3.0 worked for me. Seems to be a duplicate of https://github.com/react-hook-form/resolvers/issues/100

[prantaDutta]

It’s probably a bug in your latest release. Because I installed the beta version of this package and it’s working fine.