프론트엔드/Next.js

[Next.js] Next.js 15에서 <script/> 태그 삽입 오류 해결

순코딩 2025. 1. 10. 14:50
삽입하고 싶은 <script/> 태그
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-11544522551"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'AW-11544522551');
</script>

 

Next.js에서 삽입 예시
import Script from "next/script";

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="ko">
      <head>
        {/* Google Ads 태그 추가 */}
        <Script async src="https://www.googletagmanager.com/gtag/js?id=AW-11544522551" />
        <Script id="google-ads-tag">
          {`
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', 'AW-11544522551');
          `}
        </Script>
      </head>
      <body>
{children}
      </body>
    </html>
  );
}