css - 自定义字体未在反应定向流应用程序中加载

Question

我创建了一个 javascript 重定向应用程序。我正在尝试加载本地字体，但无法加载。

以下是我应用的详细信息和代码片段。

文件夹结构

字体.css

@font-face {
    font-family: 'MyLocalFont';
    src: local('MyLocalFont'),
         url('./fonts/MyLocalFont.woff') format('woff'),
         url('./fonts/MyLocalFont.woff2') format('woff2');
}

direflow-components/testing-component/index.js

plugins: [
    {
      name: 'font-loader',
      options: {
        custom: {
          families: ['MyLocalFont'],
          urls: ['/fonts.css']
        },
      },
    },
  ],

应用程序.css

.header-title {
  font-size: 34px;
  color: #5781C2;
  font-family: 'MyLocalFont';
}

字体文件不加载。请帮忙。

注意：使用 create-react-app 构建了一个 react 应用程序，其中 @font-face 更改了字体加载。带有 direflow 的东西不起作用。

Answer 1

我解决了这个问题，似乎font-loader不需要插件。我把它从direflow-components/testing-component/index.js.

我所做的另一个更改是从font-family.

应用程序.css

.header-title {
    font-family: MyLocalFont;
}