non.geist

non.geist

使用Vercel的字体，Geist－Sans＆Mono（ v 1.4 ）的软件包，用于非next.js项目。

为什么

我试图在一个React项目中使用Geist，它错误的（这取决于next/font ）。我喜欢包装提供的灵活性－不必管理资产（或依赖项）；我认为很多开发人员都喜欢这个。
现在，它甚至都不是@font-face a Font（或字体）的麻烦，使用可变字体甚至更容易。无论如何，这是一个可靠的良好（包装）。

安装

npm i non.geist

yarn add non.geist

pnpm i non.geist

bun add non.geist

用法

默认导入提供可变字体。

在您的条目.js（x）或.ts（x）文件中，您可以像这样导入：

 import 'non.geist'

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

然后，

 body {
  font-family : 'Geist Variable' ;

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

或直接在CSS中进行

 @import url ( 'non.geist' );

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

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

一路可变字体，但是如果您需要geist，则没有单个权重：

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 '

对于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 '

单个权重的font-family值：

 @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' ;

各种各样的

附加@font-face规则：

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

要探索字体样式集，请使用CSS的font-feature-settings属性。

执照

执照

学分

谢谢你

---

发展

安装依赖项：

bun install

运行：

 cd ./scripts
bun run index.ts

该项目是在BUN V1.0.3中使用bun init创建的。 BUN是一个快速的多合一JavaScript运行时。