为什么在 React 应用程序中使用 @import 来使用谷歌字体？答案

【问题标题】：Why use @import to use google fonts in React app?为什么在 React 应用程序中使用 @import 来使用谷歌字体？
【发布时间】：2020-07-27 12:41:38
【问题描述】：

我想了解为什么我必须使用 @import 而不是 url 在 React 应用程序中使用谷歌字体。
我尝试在 html 头中使用 url 链接，但该应用程序无法使用谷歌字体。
我在 Stackoverflow 上找到了这个解决方案，我必须使用 @import 来解决这个问题，但我想知道为什么。

能否请您解释一下为什么 html head 中的链接不起作用？

【问题讨论】：

【解决方案1】：

它与 react 本身无关，但与 CSS 相关，因为您不能使用 @import 语法在 react 或 javascript 中导入组件或其他函数，但您可以在 CSS 文件中使用它来导入样式文件的另一个样式表，例如字体。

【讨论】：

感谢您的回答。您能否解释一下“无法在反应中导入组件或功能”的含义？是不是意味着html head中添加的google fonts mdn不能加载到组件中？但是最终不是html body下的所有组件吗？为什么head中的这个链接不会影响他们？
在 CSS 中导入东西你应该使用@import,
但是你在 javascript（或者特别是 Reactjs）中导入东西，你应该使用 export import 语法，你应该阅读这个： - create-react-app.dev/docs/importing-a-component - developer.mozilla.org/en-US/docs/web/javascript/reference/…

【解决方案2】：

它与 React 无关，你可以从你的 css 文件中导入谷歌字体，你也可以在你的 app.css 文件中做同样的事情。

【讨论】：