Moait
홈인기 피드모든 블로그모든 태그
홈인기 피드모든 블로그모든 태그
문제 해결을 넘어 - 문제의 근본적인 원인 찾아가기 Part 2 섬네일

문제 해결을 넘어 - 문제의 근본적인 원인 찾아가기 Part 2

카카오엔터테인먼트 favicon카카오엔터테인먼트·Frontend·
TypeScriptReactJavaScriptNextJSCSS
2023년 04월 21일0

AI 요약

이 글은 AI가 요약했어요. 정확한 내용은 꼭 원문을 확인해 주세요!

핵심 요약

카카오엔터테인먼트가 Next.js 기반 서비스에서 swiper/css 로딩 시 발생하던 CORS 이슈를 전역 임포트와 crossorigin 설정으로 해결한 사례를 공유합니다.

구현 방법

  • 전역 _app.tsx에서 swiper/css를 임포트해 하나의 CSS 파일로 합치도록 구성
  • next.config.js에 crossOrigin: 'anonymous' 설정 추가
  • HTML link 태그에 crossorigin 속성 도입으로 CORS 정책 준수 강제

주요 결과

  • 캐시 사용 시에도 CORS 에러가 재발하지 않음
  • 정주행 모드 옵션이 유지되는 것을 확인
  • Code Splitting 및 Client-Side Navigation의 효과 이해에 도움이 됨

연관 피드

%가 높을수록 이 글과 비슷할 가능성이 높아요!
문제 해결을 넘어 - 문제의 근본적인 원인 찾아가기 Part 1 섬네일
85%

문제 해결을 넘어 - 문제의 근본적인 원인 찾아가기 Part 1

카카오엔터테인먼트 favicon카카오엔터테인먼트·2023년 04월 20일
React 이벤트와 브라우저 이벤트 섬네일
70%

React 이벤트와 브라우저 이벤트

카카오엔터테인먼트 favicon카카오엔터테인먼트·2022년 09월 08일
사용자 경험과 성능 개선 방법 in 카카오웹툰 섬네일
70%

사용자 경험과 성능 개선 방법 in 카카오웹툰

카카오엔터테인먼트 favicon카카오엔터테인먼트·2022년 01월 20일