./pages/_document.js 7:9 Error: Synchronous scripts should not be used. See: https://nextjs.org/docs/messages/no-sync-scripts @next/next/no-sync-scripts 8:9
Error: Synchronous scripts should not be used. See: https://nextjs.org/docs/messages/no-sync-scripts @next/next/no-sync-scripts 9:9
Error: Synchronous scripts should not be used. See: https://nextjs.org/docs/messages/no-sync-scripts @next/next/no-sync-scripts 10:9
Error: Synchronous scripts should not be used. See: https://nextjs.org/docs/messages/no-sync-scripts @next/next/no-sync-scripts
next에서 얼굴에 필터 기능을 입히기 위해 바닐라 자쓰로 된 라이브러리를 사용하면서
__document.js에서 외부 스크립트를 추가햇엇다
중간중간 npm run build를 하면서 내가 잘못하고 잇는 부분이 잇나 확인할 겸 빌드를 해봤는데 위와 같은 에러가 발생했엇다
직역 그대로 동적 스크립트를 사용할 수 없다는 경고엿고
import { Html, Head, Main, NextScript } from "next/document";
export default function Document() {
return (
<Html lang="en">
<Head>
<script src="/jeelizFaceFilter/dist/jeelizFaceFilter.js" async></script>
<script src="/jeelizFaceFilter/libs/three/matrix/THREEMatrix.js" async></script>
<script src="/jeelizFaceFilter/main.js" async></script>
<script src="/jeelizFaceFilter/appearance/widget.js" async></script>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
요렇게 스크립트에 async를 붙여 비동기로 불러오니 에러가 사라져땅
오늘의 반성
: 요즘 입사하고나서 구현할 기능들이 많다보니 pages에 임시로 컴포넌트 생성하는거 마냥 로직 짜놓고 그대로 냅두고 작업하는 경우들이 있었는데 그렇게 하면 나중에 내가 헷갈리게 되고 빌드할 때도 에러가 발생할 수 있으니( 컴포넌트 대문자로 쓰라는 에러가 페이지 폴더내에서 여기서 발생하면 안되징 ) 아무리 바빠 귀찮다는 생각이 들어도 테스트 작업을 하더라도 컴포넌트를 나누면서 코드를 작성해야겟다는 생각이 들었당
'🤪 뜨거운 맛 오류 일기' 카테고리의 다른 글
| react-modal: App element is not defined. / 리액트 모달쓰면서 만난 에러 (0) | 2023.07.18 |
|---|---|
| Failed to load plugin 'jsx-a11y' declared in 'package.json (0) | 2023.06.14 |
| 지긋지긋해 WebSocket connection 에러가 뭘까아아아 (0) | 2023.05.18 |
| error = Cannot set headers after they are sent to the client 해결하기 (0) | 2023.05.11 |
| 오류메시지 : SSL :CERTIFICATE_VERIFY_FAILED (0) | 2023.03.18 |
댓글