개발자
nextjs에서 글로벌 스코프에 객체를 만들어야하는 상황인데 질문이 있습니다.
Next.js에서 글로벌 스코프에 객체를 만들어야 하는 상황에서, 다음과 같은 스크립트 태그를 _document.tsx의 head에 삽입했지만, IMP(아임포트) 객체가 window에 생성되지 않는 문제가 있습니다. 이 문제를 해결하기 위해서는 어떻게 해야 할까요? IMP 객체 생성에 jQuery가 의존성을 가지고 있습니다.
1<!— jQuery —>
2 <script type=""text/javascript"" src=""https://code.jquery.com/jquery-1.12.4.min.js"" ></script>
3 <!— iamport.payment.js —>
4 <script type=""text/javascript"" src=""https://cdn.iamport.kr/js/iamport.payment-1.1.7.js""></script>
답변 2
잘되는데요? _document.tsx 전체내용이 어케되는지요
Next.js에서 글로벌 스코프에 객체를 생성하기 위해서는 다음과 같은 방법을 고려할 수 있습니다. 1. Custom '<Script>' 컴포넌트 사용: Next.js에서는 Custom '<Script>' 컴포넌트를 사용하여 원하는 스크립트를 페이지에 추가할 수 있습니다. 이를 활용하여 '_document.tsx' 파일에 '<Script>' 컴포넌트를 작성하고, 거기에 스크립트 태그를 추가할 수 있습니다. 예를 들면: 2. 'next/head 사용: 'next/head' 모듈을 사용하여 '_document.tsx' 파일의 '<Head>' 컴포넌트 안에 직접 스크립트 '태그를 추가할 수도 있습니다. 예를 들면: 이러한 방법을 사용하여 '_document.tsx'파일에서 필요한 스크립트를 추가하면, 해당 스크립트는 Next.js의 페이지에서 글로벌 스코프에서 사용할 수 있게 될 것입니다.
1#1
2import Document, { Html, Head, Main, NextScript } from 'next/document';
3import Script from 'next/script';
4
5class MyDocument extends Document {
6 render() {
7 return (
8 <Html>
9 <Head>
10 <Script
11 strategy="beforeInteractive"
12 src="https://code.jquery.com/jquery-1.12.4.min.js"
13 />
14 <Script
15 strategy="beforeInteractive"
16 src="https://cdn.iamport.kr/js/iamport.payment-1.1.7.js"
17 />
18 </Head>
19 <body>
20 <Main />
21 <NextScript />
22 </body>
23 </Html>
24 );
25 }
26}
27
28export default MyDocument;
29
30#2
31import Document, { Html, Head, Main, NextScript } from 'next/document';
32
33class MyDocument extends Document {
34 render() {
35 return (
36 <Html>
37 <Head>
38 <script
39 type="text/javascript"
40 src="https://code.jquery.com/jquery-1.12.4.min.js"
41 />
42 <script
43 type="text/javascript"
44 src="https://cdn.iamport.kr/js/iamport.payment-1.1.7.js"
45 />
46 </Head>
47 <body>
48 <Main />
49 <NextScript />
50 </body>
51 </Html>
52 );
53 }
54}
55
56export default MyDocument;커리어리 AI 봇의 답변을 평가해 주세요!
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
지금 가입하면 모든 질문의 답변을 볼 수 있어요!