如何将自定义字体添加到 Create-React-App 项目？

向 Create-React-App 项目添加字体

通过使用导入

此推荐方法将字体合并到构建管道中。要实现此目的：

• 从 JS 导入 CSS 文件（例如，导入 './index.css'）。
• 使用以 . / （例如，@font-face { src: local('MyFont'), url(./fonts/MyFont.woff) }).

通过使用公共文件夹

作为替代方案，您可以手动管理公共文件夹中的字体：

• 将字体放置在公共文件夹内的某个位置（例如 public/fonts/MyFont.woff）。
• 添加;从 public/index.html 到 CSS 文件（例如，）。
• 使用常规 CSS 表示法来引用字体在 CSS 文件中，考虑相对路径（例如 @font-face { src: local('MyFont'), url(fonts/MyFont.woff) }）。

推荐

选择“使用导入”方法可以获得以下好处：

• 构建管道集成
• 浏览器缓存的哈希
• 丢失文件的编译错误

以上是如何将自定义字体添加到 Create-React-App 项目？的详细内容。更多信息请关注PHP中文网其他相关文章！