orioncactus/pretendard

yarn add pretendard 이후 사용법

Closed this issue · 6 comments

naninyang commented

next.js 13 이상 버전을 사용하고 있습니다.
yarn add pretendard를 하고 나서 import를 어떻게 해야할지 모르겠어요. 설치 방법만 나와있고 사용 방법은 나와있지 않네요.

black7375 commented

설치를 해보면 아마 다음 주소와 동일한 파일 구조일거에요.

약간 살펴보면, dist/web/static 쪽에 css파일들이 있습니다.

그래서 아마 이런식으로 사용할 수 있을겁니다.

@import "pretendard/dist/web/static/pretendard.css"

Vite같은 번들러를 사용하신다면 자바스크립트나 타입스크립트 파일에서 import가 가능할거에요.

import "pretendard/dist/web/static/pretendard.css"
  • 👍3
  • ❤️2
naninyang commented

감사합니다. 아주 잘 동작하네요.

  • 👍1
orioncactus commented

@black7375 님, 이렇게 빠르게 확인해주시고 해결 방법을 알려주셔서 감사드립니다!

이 이슈는 해결 처리로 해두겠습니다. 혹시나 쓰시면서 다른 문제가 있다면 언제든지 알려주세요! ✨

lacomparte commented

@orioncactus 님 안녕하세요~!
혹시 번들러 사용시(webpakc) dynamic subset을 사용하려면 어떤 css 를 import 해야 할까요??
꼭 static 에 있는 css 만 import해야 하나요!?

naninyang commented

@orioncactus 님 안녕하세요~! 혹시 번들러 사용시(webpakc) dynamic subset을 사용하려면 어떤 css 를 import 해야 할까요?? 꼭 static 에 있는 css 만 import해야 하나요!?

여기 를 보시면 Dynamic subset도 css가 있습니다.

  • 👍2
orioncactus commented

@orioncactus 님 안녕하세요~! 혹시 번들러 사용시(webpakc) dynamic subset을 사용하려면 어떤 css 를 import 해야 할까요?? 꼭 static 에 있는 css 만 import해야 하나요!?

@lacomparte 안녕하세요! Pretendard를 패키지 형태로 사용하신다면 @naninyang 님께서 친절히 설명해주신 것처럼 web/static 또는 web/variable에 있는 *-dynamic-subset.css 파일을 불러오도록 하면 됩니다. 호환성에 중점을 둔다면 web/static으로, 용량 절감에 중점을 둔다면 web/variable에 있는 다이나믹 서브셋 파일을 사용하시는 것을 추천드립니다 :D