我最近打开了一些我必须开发的移动应用模型。我正在使用 React Native（与 Expo）。问题是，这个模型使用了很多 Adobe 字体（Typekit）。
我遇到了文档：https://helpx.adobe.com/fonts/using/embed-codes.html，它可以用于网络应用程序，而不是编译的移动应用程序。
我找不到任何关于它的问题，但我想知道移动应用程序开发人员如何在他们的项目中实现 Typekit 字体？
【问题讨论】：
标签： android ios react-native adobe typekit
来自 Adobe website 上的字体许可页面：
我可以将字体嵌入到我正在构建的移动或桌面应用程序中吗？ 不可以。字体许可不允许您在其中嵌入字体 移动或桌面应用程序。这需要适当的许可证 直接从代工厂或他们的授权之一购买 经销商。
警告： Adobe 可能不允许使用以下下载字体以供离线使用的方法。相反，您应该从其他地方获取字体文件，谷歌字体允许您下载它们。
在 Typekit 上将字体添加到 Web 项目后，获取嵌入链接 (href)，该链接将用于获取普通 Web 项目的 .css，例如https://use.typekit.net/XXXXXX.css。在浏览器中访问该站点以查看内容，并从每个 @font-face css 块下载第一个链接。将其重命名为"fontName".woff2。
@font-face {
font-family:"bungee";
src:url("https://use.typekit.net/af/dd8be0/00000000000000003b9b2a4f/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/dd8be0/00000000000000003b9b2a4f/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/dd8be0/00000000000000003b9b2a4f/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:400;
}
将其转换为.ttf* somewhere，重命名为字体名称并按照通常安装字体的方式。 （即使用 react-native.config.js 和 assets/fonts/ 目录，并在项目的样式对象中使用字体名称**（不是字体文件名）。
我的经验：我已经设法从css文件中以woff2格式从Typekit下载字体，将其转换为ttf，将字体文件重命名为字体名称，将其放入项目中，运行npx react-native link（即使我使用自动链接），因此它适用于 iOS 和 Android 应用程序。
我最近回答了一个 question 关于如何为 react-native 安装字体的问题。
*我们为什么要转换成 ttf？： 每个@font-face 块都有多种不同的格式，但第一个链接（woff2 格式）仅适用于我在 react native 上的 iOS。 Android 无法加载它，甚至 android studio 也无法打开该文件。而最后一个链接（otf格式），只能在Android上使用，iOS无法加载。所以解决的办法就是把woff2文件转换成ttf，这是我在react native上常用的自定义字体。
**为什么我需要将文件重命名为字体名称？： 请记住，iOS 使用字体名称，而 android 使用文件名称。最简单的解决方案是将文件重命名为字体名称，这样您的代码就可以在 iOS 和 android 上运行，而无需使用 Platform 模块。 （通过字体应用打开字体找出字体名称）
【讨论】：
正确的方法是指定您需要在 react 本机代码中使用的字体。意思就是使用它。 然后在您的 android 和 ios 构建项目中，只需将字体导入您的资源。 希望这会有所帮助
【讨论】：