Hello, I am trying to add SpeedInsights to my nextjs app in _app.js file, but the script is not getting loaded in the networks tab. Strangely analytics is working though. I have a _document.js file as well.
// nextjs version and speed-insights versions
“next”: “13.4.12”,
“@vercel/speed-insights”: “^1.0.12”,
// _app.js
import { SpeedInsights } from "@vercel/speed-insights/next";
import "../global.css";
import "react-toastify/dist/ReactToastify.css";
import Layout from "@/components/Layout";
import { useEffect } from "react";
import { useRouter } from "next/router";
import { ToastContainer } from "react-toastify";
const unprotectedRoutes = [
"/user/login",
"/user/request-password-reset",
"/user/reset-password",
];
export default function App({ Component, pageProps }) {
const router = useRouter();
useEffect(() => {
const token = localStorage.getItem("token");
const user = JSON.parse(localStorage.getItem("user"));
console.log({ token });
if (!token && !unprotectedRoutes.includes(router.pathname)) {
router.push("/user/login");
}
}, [router.pathname]);
return (
<main>
<Layout />
<div className="max-w-[1500px] 2xl:mx-auto pt-[120px] pb-10 xl:mx-[40px]">
<Component {...pageProps} />
{/* <SpeedInsights /> */}
<ToastContainer />
</div>
</main>
);
}
