Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

RHF hookform resolvers throwing error in terminal

See original GitHub issue

Describe the bug RHF throws error in terminal -

c:\dev\edugyanam\admin\node_modules\@hookform\resolvers\dist\yup.js:2
import { transformToNestObject } from 'react-hook-form';
^^^^^^

SyntaxError: Cannot use import statement outside a module

My RHF code -

const yupSchema = Yup.object().shape({
......
  });

  const { register, handleSubmit, watch, setValue, errors, setError, clearErrors, control, formState } = useForm<UserLoginData>({
    resolver: yupResolver(yupSchema),
    mode: 'onSubmit',
    reValidateMode: 'onChange',
  });
  const { isDirty, touched, submitCount, isSubmitted } = formState;

  const onSubmit = async (data: any, e: any) => { ...

Expected behavior It should have been compiled without errors. It was working fine before as well, started throwing errors after updating my npm packages.

CodeSandbox Demo https://codesandbox.io/s/nifty-grass-k6r3z?file=/pages/index.tsx

Screenshots

Environments:

Using Next.js 10.0.5 (latest)
Using RHF 6.14.1 (latest)
@hookform/resolvers version: 1.3.2
Running on Node.js 15.5.x

Issue Analytics

State:
Created 3 years ago
Reactions:6
Comments:5 (2 by maintainers)

Top GitHub Comments

2reactions

gauravkrpcommented, Jan 13, 2021

@bluebill1049 #100 https://github.com/react-hook-form/react-hook-form/issues/3816

2reactions

sokardyscommented, Jan 13, 2021

Minimal sample, only importing libs: https://codesandbox.io/s/react-hook-form-wbhjt

Top Results From Across the Web

Attempted import error: 'set' is not exported from 'react-hook ...

I ran into this issue when using react-hook-form v6.16.5 and @hookform/resolvers v2.5.2. I downgraded @hookform/resolvers to v1.3.7 and it ...

react hook form onblur not working - You.com | The AI Search ...

I've used the example in a codesandbox and it threw errors about ref and it suggested using React.forwardRef , change your custom Input...

React form validation with React Hook Form and Yup

Now we have to import @hookform/resolvers so we can use our Yup schema to validate input values. Like this: import { yupResolver }...

useFormState - ErrorMessage - React Hook Form

A simple component to render associated input's error message. npm install @hookform/error-message. Props. Name, Type, Required, Description ...

npm install react-hook-form 6 Code Example

import React from 'react';import { useForm } from 'react-hook-form'; function App() { const { register, handleSubmit, errors } = useForm(); // initialise ...