javascript - @font-face 未在反应应用程序中加载（故事书）

Question

我在从本地加载字体时遇到问题，我指向目录。有人可以帮我吗？

这是我的代码

@font-face {
  font-family: 'My font';
  src: url('./fonts/Myfonts-webfont.eot');
  src: url('./fonts/Myfonts-webfont.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Myfonts-webfont.woff') format('woff'),
    url('./fonts/Myfonts-webfont.ttf') format('truetype'),
    url('./fonts/Myfonts-webfont.svg#my_fonts_otbook') format('svg');
  font-weight: normal;
  font-style: normal;
}

and using it as 
.btn {
  font-family: 'My font', sans-serif;
  max-width: 100%;
  width: 20%;
  height: 8%;
}

标签： javascriptcssreactjsfontsstorybook

Answer 1

您是否使用 webpack 文件加载器来加载路径，您不必指定字体文件所在的位置。只要您将字体文件包含在 src/assets/fonts 中，file-loader 就会为您找到它。