how to load face-api.js and coco-ssd models in react without getting Unhandled Rejection (TypeError): t is not a function

Question

I am trying to detect emotion in faces and objects using face-api.js and tensorflow-models/coco-ssd but when i try to load these models i am getting this error Unhandled Rejection (TypeError): t is not a function. This project was created with create-react-app and i am loading faci-api.js models from public folder.

import React from "react";
import * as faceapi from "face-api.js";
import * as cocoSsd from "@tensorflow-models/coco-ssd";
import * as tf from "@tensorflow/tfjs";

const EmotionObjectDetection = () => {
  const handleClick = async () => {
    const video = document.getElementById("video");

    const startVideo = () => {
      navigator.getUserMedia =
        navigator.getUserMedia ||
        navigator.webkitGetUserMedia ||
        navigator.mozGetUserMedia ||
        navigator.msGetUserMedia;

      if (navigator.getUserMedia) {
        navigator.getUserMedia(
          { video: true },
          function (stream) {
            var video = document.querySelector("video");
            video.srcObject = stream;
            video.onloadedmetadata = function (e) {
              video.play();
            };
          },
          function (err) {
            console.log(err.name);
          }
        );
      } else {
        document.body.innerText = "getUserMedia not supported";
        console.log("getUserMedia not supported");
      }
    };

    const MODEL_URL = process.env.PUBLIC_URL + "/models";
    const net = cocoSsd.load();
    Promise.all([
      net, // i am getting the error here
      faceapi.nets.tinyFaceDetector.loadFromUri(MODEL_URL),
      faceapi.nets.faceLandmark68Net.loadFromUri(MODEL_URL),
      faceapi.nets.faceRecognitionNet.loadFromUri(MODEL_URL),
      faceapi.nets.faceExpressionNet.loadFromUri(MODEL_URL),
    ]).then(startVideo).catch(err => console.log(err))

    video.addEventListener("play", () => {
      setInterval(() => {
        const predictions = faceapi
          .detectAllFaces(video, new faceapi.TinyFaceDetectorOptions())
          .withFaceLandmarks()
          .withFaceExpressions();

        const obj = net.detect(video);
        console.log(predictions);
        console.log(obj);
      }, 100);
    });
  };

  return (
    <div>
      <button onClick={handleClick}>click</button>

      <video
        className='video'
        autoPlay
        muted
        id='video'
        width='720'
        height='420'></video>
    </div>
  );
};

export default EmotionObjectDetection;