astro fonts next

천체-폰트-텍스트

이 통합은 다음으로 Astro에 다음에 적용됩니다. 참조 : https://nextjs.org/docs/basic-features/font-optimization

설치

yarn add -D astro-fonts-next

용법

 // astro.config.mjs
import { defineConfig } from 'astro/config'
import fonts from 'astro-fonts-next'

export default defineConfig ( {
  integrations : [
    fonts ( { url : 'https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap' } ) ,
    // fonts({ url: 'https://use.typekit.net/~~~~~.css' }),
    // or
    fonts ( {
      url : [
        'https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap' ,
        'https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap' ,
      ] ,
    } ) ,
  ] ,
  experimental : {
    integrations : true ,
  } ,
} ) 

API 참조

완성

import fonts from 'astro-fonts-next'

열쇠	유형	필수의	기본	설명
URL	string | string[]	진실		사용될 글꼴 제공 업체에 대한 실제 링크. 배열에 둘 이상을 지정할 수 있습니다. (예 : <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet"> → https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap ;700&display=swap)

특허

Astro-Fonts-Next는 MIT 라이센스로 제공됩니다.