Kösse össze a betűtípusokat a webalkalmazásban

Hogyan biztosít a Fontsource betűtípusokat az alkalmazáshoz

Önkiszolgáló betűtípusok

Ha kötegelni szeretné a webalkalmazásában használt betűtípusokat, akkor a Fontsource egy olyan könyvtár, amelyre érdemes lehet egy pillantást vetni (link szintén az oldal végén található mellékletben). Lehetővé teszi a felhasználni kívánt betűtípusok telepítését, ami azt jelenti, hogy a betűtípusokat saját maga tárolja, és nincs szükség CDN-re a betöltéshez.

Az egyes betűtípusok telepítése

A használni kívánt betűtípusok telepítéséhez egyszerűen futtassa az install-parancsot az egyes változatokhoz. A következő kódrészletek bemutatják, hogy a PWA betűtípusa hogyan lesz telepítve.

npm install @fontsource/work-sans

Az alkalmazásom belépési pontjában ezután fel kell használnom a telepített csomagot importálással. Ez lehetővé teszi, hogy pontosan meghatározhassam, mire van szükségem anélkül, hogy bármiféle általános költséget kellene hozzáadnom. Mivel a betűtípusok meglehetősen nagyok lehetnek, ez nagyszerű lehetőség bájtok megtakarítására.

import "@fontsource/work-sans/400.css";
import "@fontsource/work-sans/900-italic.css";

Végül be kell állítanom a betűtípuscsaládot a CSS-ben. A használt könyvtártól függően (például Tailwind.css) ez a kód kissé eltérően jelenhet meg az Ön számára.

body {
  font-family: "Work Sans", sans-serif;
}

Változó betűtípusok

A Fontsource lehetőséget biztosít változó betűtípusok telepítésére is, ami azt jelenti, hogy a legújabb eszközökhöz férhet hozzá a betűtípusok betöltéséhez. Kérjük, vegye figyelembe, hogy nem minden betűtípus érhető el változó változatként.