TypeError: ... is not a function when using dynamic import

Question

I'm trying to import @toolz/use-synchronous-state module into my Next.js page. (using next/dynamic):

import dynamic from "next/dynamic";
export default function index() {
  const useSynchronousState = dynamic(() => import("@toolz/use-synchronous-state").then(m => m.useSynchronousState));
  const [userNumber, setUserNumber] = useSynchronousState(null);
  return(.......);
}

But it returns a runtime error.

TypeError: useSynchronousState is not a function

I also tried regular import but it returns the same error:

const useSynchronousState = import("@toolz/use-synchronous-state");

Answer 1

If it's not a React component, you need to import it without using next/dynamic, like this: (await import(__PATH__)).default