[NJ(386)]테스트 빌드 실행하기 & 코드 크기 줄이기

이유정·2024년 6월 13일
0

Next.js (pages router)

목록 보기
51/51
post-custom-banner


로컬 머신에서 테스트 빌드를 해보자 .


npm run build 했을 때 빨간 표시가 나는 것은, 코드 용량이 크다는 뜻이다.

배포하기 전에 이 issue를 해결해보자.

slug 페이지를 봐보자.


slug 페이지 자체는 용량이 크지 않다.

용량이 크지 않다 222

  • getStaticProps, getStaticPaths 내에서만 필요한 코드는 무시해도된다.
    • 빌드 프로세스랑 서버 상에서만 실행된다.
    • client side에 도달하지 않음.

      여기 크기는 client 사이드 코드 용량에 관한 것임.


이 코드 자체로는 양이 많지 않음

그러나 몇가지 third-party package를 사용중임


그 중 이 패키지가 문제임.

  • 용량이 매우 크니 , Light Build를 제공한다고 써놓음.


이런식으로 코드 변경.


해결 완료임.
근데 압축 이전의 크기임. Node.js는 이 파일을 압축할 것이기 때문에 배포하면 크기 더 작아질 것임.

정리

  • npm run build를 했을 때 빨간 표시가 나면 파일 크기 과다
  • 여러 패키지 정리하거나, light 버전 있는지 깃허브에 확인한다.
  • 코드 수정후, 다시 npm run build로 확인해준다.
  • node.js가 나중에 더 압축할 것임. !
profile
강의 기록 블로그
post-custom-banner

0개의 댓글