我使用创建了一个React应用程序,create-react-app
并选择不弹出。目前,我正在尝试使用导入本地字体@font-face
,但没有成功。
这是我当前的文件夹结构:
/
+ public/
+ src/
-- index.js
-- App.js
-- App.css
++ assets/
+++ css/
---- general.css
+++ fonts/
---- CircularStd-Medium.woff
在上App.js
,我正在导入general.css
文件(import './assets/css/general.css';
)。
在general.css
档案上,我按@font-face
如下所述进行设置:
@font-face {
font-family: 'CircularStd-Medium';
font-style: normal;
src: local('CircularStd-Medium'), local('CircularStd-Medium'),
url('../fonts/CircularStd-Medium.woff') format('woff'),
}
我已经尝试遵循此答案,但是它没有用。该代码可以编译,但是会显示一个简单的Times New Roman。
有趣的是,我正在导入相同的字体。当我将其放在公用文件夹中时,它不起作用。因此,我将其移至“路由器”区域(因为它也很全局)。现在,字体通过构建管道并可以工作
require('./fonts/circular-std-master/css/circular-std.css');
签出我的代码仓库;)
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句