non.geist

non.

Un package pour utiliser les polices de caractères de Vercel, Geist－ Sans & Mono ( V 1.4 ), pour les projets non next.js.

Le pourquoi

J'ai essayé d'utiliser Geist dans un projet React, il s'est trompé (cela dépend de next/font ). J'aime la flexibilité qu'un package offre － sans avoir à gérer les actifs (ou les dépendances); Je prends beaucoup de développeurs, peut-être, peut-être.
Maintenant, ce n'est même pas un problème pour @font-face une police (ou une police), il est encore plus facile avec des polices variables. Quoi qu'il en soit, c'est un solide agréable (paquet).

Installation

npm i non.geist

yarn add non.geist

pnpm i non.geist

bun add non.geist

Usage

L'importation par défaut fournit des polices variables .

Dans votre fichier d'entrée .js (x) ou .ts (x), vous pouvez importer comme:

 import 'non.geist'

// For Geist Mono
import 'non.geist/mono'

alors,

 body {
  font-family : 'Geist Variable' ;

  /* For Geist Mono */
  font-family : 'Geist Mono Variable' ;
}

Ou faites-le en CSS directement

 @import url ( 'non.geist' );

body {
  font-family : 'Geist Variable' ;
}
/* For Geist Mono */

@import url ( 'non.geist/mono' );
font-family : 'Geist Mono Variable' ;

Polices variables jusqu'au bout, mais si vous avez besoin de Geist sans poids individuel:

import ' non.geist/font-faces/Geist-Black.css '
import ' non.geist/font-faces/Geist-Bold.css '
import ' non.geist/font-faces/Geist-Light.css '
import ' non.geist/font-faces/Geist-Medium.css '
import ' non.geist/font-faces/Geist-Regular.css '
import ' non.geist/font-faces/Geist-SemiBold.css '
import ' non.geist/font-faces/Geist-Thin.css '
import ' non.geist/font-faces/Geist-UltraBlack.css '
import ' non.geist/font-faces/Geist-UltraLight.css '

Pour Geist Mono:

import ' non.geist/font-faces/GeistMono-Black.css '
import ' non.geist/font-faces/GeistMono-Bold.css '
import ' non.geist/font-faces/GeistMono-Light.css '
import ' non.geist/font-faces/GeistMono-Medium.css '
import ' non.geist/font-faces/GeistMono-Regular.css '
import ' non.geist/font-faces/GeistMono-SemiBold.css '
import ' non.geist/font-faces/GeistMono-Thin.css '
import ' non.geist/font-faces/GeistMono-UltraBlack.css '
import ' non.geist/font-faces/Geist-MonoUltraLight.css '

Valeurs font-family pour les poids individuels:

 @import url ( 'non.geist/font-faces/Geist-Bold.css' );

font-family : 'Geist-Bold' ;
/* Geist Mono */
@import url ( 'non.geist/font-faces/GeistMono-Bold.css' );

font-family : 'GeistMono-Bold' ;

Divers

Règles supplémentaires @font-face :

 font-display : swap;
font-synthesis : none;

Pour explorer les ensembles stylistiques des polices de type, utilisez la propriété font-feature-settings de CSS.

Licence

Licence

Crédits

Merci Vercel

---

Développement

Pour installer les dépendances:

bun install

Pour courir:

 cd ./scripts
bun run index.ts

Ce projet a été créé à l'aide de bun init dans BUN V1.0.3. BUN est un runtime JavaScript tout-en-un rapide.