Question

我目前正在为需要实现网站（他在艺术学校）的哥哥开发一个小项目。

我打算在React中做这件事（对我来说很有益）

我最近开始使用Sass并爱上了它，它比普通的CSS方便得多！

无论如何，他给了我一种用于他的网站的字体（https://www.velvetyne.fr/fonts/le-murmure/），但是我无法管理将其导入项目中。我读了很多科目，但我无法使它起作用。

因此，我发现他们有两种解决方案，一种是使用import，因为字体会进入构建管道，而另一种是直接使用build文件夹。显然，使用导入是最佳做法。

我找到了这个答案，说我们需要将它们放在资产文件夹（https://github.com/angular/angular-cli/issues/5213#issuecomment-284783844）中，所以这就是我所做的，这次我没有收到任何错误消息，说“嘿，无法解决blablabla”，但这只是不要使用字体。 +我可以放任何我想要的东西，例如'/ assets / somethings / dumb'我不会收到任何错误消息。

我会给您发一张我的树的照片，以便您看得更好

https://ibb.co/KjkCNJ1

这是我的_typography.scss

@font-face {
    font-family: 'murmure';
    src:  url('/assets/fonts/Le_Murmure-Regular_web.eot');
    src:  url('/assets/fonts/Le_Murmure-Regular_web.eot?#iefix') format('embedded-opentype'),
          url('/assets/fonts/Le_Murmure-Regular_web.woff') format('woff'),
          url('/assets/fonts/Le_Murmure-Regular_web.woff2') format('woff2'),
          url('/assets/fonts/Le_Murmure-Regular_web.ttf') format('truetype'),
          url('/assets/fonts/Le_Murmure-Regular_web.svg#svgFontName') format('svg');
    font-weight: normal;
    font-style: normal;
  }

我要导入到main.scss

//      ABSTRACTS
@import './abstracts/functions';
@import './abstracts/mixins';
@import './abstracts/variables';

//      BASE
@import './base/typography';
@import './base/base';
@import './base/animations';
@import './base/utilities';

//      COMPONENTS
@import './components/input.scss';

//      LAYOUTS 

//      PAGES

@import './screens/home';

我将其导入App.tsx

import '@assets/sass/main.scss';

最后

我的屏幕上有一条规则/_home.scss

.home {
    &__title {
        font-size: 500px;
        font-family: "murmure", serif !important;
    }
}

唯一要应用的是字体大小 https://ibb.co/gt2Bvdz

有人知道如何导入字体吗？

我真的陷入了困境：/ 有印象，我只是尝试了所有可能的相对进口商品

无法在React中导入字体（node-sass）

0 个答案: