astro fonts next

Astro-Fonts-Next

此集成将NEXT.JS字体优化解决方案应用于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: https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap ?family=Roboto:wght@400;700＆display=swap）

执照

Astro-Fonts-Next可根据MIT许可获得。