https://nextjs.org/docs/pages/api-reference/components/font
import { Inter } from 'next/font/google'
import styles from '../styles/component.module.css'
const inter = Inter({
variable: '--font-inter',
})
<main className={inter.variable}>
<p className={styles.text}>Hello World</p>
</main>
google font 的字体直接 import 使用挺方便的,但是这个字体在国内又无法访问,有没有什么解决办法,或者可代替的字体库?除了把字体下载下来这个办法之外。
1
rizon OP 没事了,这个字体使用的时候不会向 google 服务器发送请求。 帖子删不掉了。就当分享贴了。
|next/font includes built-in automatic self-hosting for any font file. This means you can optimally load web fonts with zero layout shift, thanks to the underlying CSS size-adjust property used. |This new font system also allows you to conveniently use all Google Fonts with performance and privacy in mind. CSS and font files are downloaded at build time and self-hosted with the rest of your static assets. No requests are sent to Google by the browser. |