한글 폰트를 Self-host 할 수 있다!
- NPM에서 원하는 폰트를 설치해주세요.
$ npm install --save @kfonts/nanum-gothic
- 자신의 JavaScript 내지는 TypeScript 프로젝트에 import 해주세요.
import '@kfonts/nanum-gothic';
- 불러온 폰트를 필요한 곳에 적용하면 끝!
body { font-family: '나눔고딕'; }
폰트를 추가하고 싶으시다면 다음 요건이 충족되는지 확인해주세요.
- 폰트의 포멧 변환이 허용되는지 (ttf 파일을 woff 등의 다른 포멧으로 변경해도 되는지)
- 폰트 파일의 이름(폰트의 이름이 아님)을 수정해도 되는지 (오작동 방지를 위해 띄어쓰기나 특수문자 제거)
- 폰트를 누구나 아무런 제약사항없이 사용해도 되는지
- 모든 사람이 폰트를 GitHub과 npm 저장소에서 아무런 제약없이 받아다 써도 되는지
- 자신이 해당 폰트의 저작권자 내지는 저작권자의 허가를 받았는지
모든 요건이 충족된다면 본 저장소의 이슈트래커에 제보해주세요.
해당 폰트의 저작권자분께서 본 프로젝트에서 폰트 배포의 정지를 원하신다면 이슈트래커에 제보해주시면 최대한 빨리 해당 폰트의 배포를 중지해드립니다. 이를 위해 자신이 저작권자가 맞음을 확인할 수 있도록 가급적 본인/기업의 메일로 가입된 공식 GitHub ID를 사용해주세요.
이미 배포된 버전이 아닌, 직접 빌드한 버전을 쓰고 싶다면 다음 의존성을 확인해주세요.
- fontforge
- woff2
$ yarn swc-node src/build.ts
명령어를 통해 웹폰트를 생성할 수 있습니다.
- 먼저
yarn npm login
명령어를 통해 npm에 로그인해주세요. clean.ts
파일을 실행해서 불필요한 파일을 패키지 경로에서 제외시켜주세요.$ yarn swc-node src/clean.ts
- 다음 명령어로 일괄배포합니다.
$ yarn workspaces foreach -A npm publish --tolerate-republish