nextjs/google-font-display 正確性
作用
強制使用 Google 字體的 font-display 行為。
為什麼這不好?
指定 `display=optional` 可最大限度地減少文字隱形或版面配置偏移的風險。如果載入後切換到自訂字體對您很重要,則請改用 `display=swap`。
範例
此規則的不正確程式碼範例
jsx
import Head from "next/head";
export default Test = () => {
return (
<Head>
<link href="https://fonts.googleapis.com/css2?family=Krona+One" rel="stylesheet" />
</Head>
);
};
此規則的正確程式碼範例
jsx
import Head from "next/head";
export default Test = () => {
return (
<Head>
<link href="https://fonts.googleapis.com/css2?family=Krona+One&display=optional" rel="stylesheet" />
</Head>
);
};