如何将自定义字体（ttf）添加到react.js应用程序

Question

我想将SFProText字体（ttf）添加到我的react应用程序中。我何时通过此article。我想知道添加字体的最简单方法是什么。

<link href="https://fonts.googleapis.com/css?family=Titillium+Web:300,400,700" rel="stylesheet">

我想知道有没有简单的方法，例如添加google字体（在代码行上方）？

我也检查了此article。但是我觉得应该有一个比这更简单的方法。

Answer 1

最简单的方法是从公用目录下index.html文件中的googleapi加载字体。之后，您只需在CSS代码中设置字体系列即可使用它。

Answer 2

尝试使用

内联添加字体

<style>
    @import url({`https://fonts.googleapis.com/css?family=${family.replace(/ /g, '+')}`});
</style>

然后做内联fontFamily

 style={{ fontFamily: `${family},${category}` }}