Problem:
The Next JS dynamic import is stuck on loading on mobile device browser (used browser: Google Chrome and Safari on IOS.) Whereas it is working perfectly on Google Chrome and Mozilla on Desktop. I am also using next-PWA on the default configuration. Could it be due to next-PWA?
Code Snippet:
import dynamic from "next/dynamic";
import { useMemo } from "react";
export default function Main() {
const Component = useMemo(
() =>
dynamic(() => import("@components/Component"), {
loading: () => <p>The component is loading</p>,
ssr: false,
}),
[],
);
return(<div><Component/></div>);
}
Output on Mobile Device
The component is loading
Output on Desktop Browser
Hello from Component