Uncaught TypeError: Cannot read properties of null (reading 'useRef') While Using useForm()

Question

The Error occured while using useForm() hook inside the functional component. Here is the code I am trying to do :-

import React from "react";
import "./form.css";
import { useForm } from "react-hook-form";
import { DevTool } from "@hookform/devtools";

function YoutubeForm() {
  const form = useForm();// this line shows error
  const { register, control } = useForm();

  return (
    <div className="form">
      <form>
        <label htmlFor="username">User Name</label>
        <input type="text" id="username"{...register("username")}/>

        <label htmlFor="email">Email</label>
        <input type="text" id="email" {...register("email")} />

        <label htmlFor="password">Channel</label>
        <input type="text" id="channel" {...register("channel")} 
         />

    <button>SUBMIT</button>
  </form>
  <DevTool control={control} />
</div>

); }

export default YoutubeForm;

Answer 1

I had not installed the react-hook-form in my project directory make sure that you install the package in you project directory.