我如何在 React JS 中使用 Google 字体

Question

我想在 React 中使用 Google 字体。 我正在使用

import 'https://fonts.googleapis.com/css?family=Josefin+Sans';

在 App.js 和

font-family: 'Josefin Sans', cursive; 

在 component.css 中，我遇到了无法编译的错误。

Answer 1

AFAIK 你不能从 URL 导入文件。 您必须将它托管在本地（获取整个文件），或者像使用另一个“基本”样式表一样将其包含在页面的标题中。

编辑

在你的component.css使用@import语法。

@import url('https://fonts.googleapis.com/css?family=Josefin+Sans');

迪伦

Answer 2

转到component.css

对于本地字体：

@font-face {
    src: url('./fonts/Report-Bold.ttf')  format('ttf');
}

对于谷歌字体：

@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');