Poick

MenuUsing App RouterFeatures available in /appLatest Version16.1.6DocsErrorsNo Before Interactive Script Outside DocumentNo Before Interactive Script Outside Document Prevent usage of next/script's beforeInteractive strategy outside of app/layout.jsx or pages/_document.js. Why This Error Occurred You cannot use the next/script component with the beforeInteractive strategy outside app/layout.jsx or pages/_document.js. That's because beforeInteractive strategy only works inside app/layout.jsx or pages/_document.js and is designed to load scripts that are needed by the entire site (i.e. the script will load when any page in the application has been loaded server-side). Possible Ways to Fix It App Router If you want a global script, and you are using the App Router, move the script inside app/layout.jsx. app/layout.jsximport Script from 'next/script' export default function RootLayout({ children }) { return ( <html lang="en"> <body>{children}</body> <Script src="https://example.com/script.js" strategy="beforeInteractive" /> </html> ) } Pages Router If you want a global script, and you are using the Pages Router, move the script inside pages/_document.js. pages/_document.jsimport { Html, Head, Main, NextScript } from 'next/document' import Script from 'next/script' export default function Document() { return ( <Html> <Head /> <body> <Main /> <NextScript /> <Script src="https://example.com/script.js" strategy="beforeInteractive" ></Script> </body> </Html> ) } Useful Links App Router Script Optimization Pages Router Script Optimization Was this helpful?

No Before Interactive Script Outside Document | Next.js