我有一个webpack项目:
main.js
project.scss
在我的项目根目录中,我还有一个名为my-package的自定义NPM包。我是字体和使用它们的SASS文件:
my-package/fonts/font.woff
my-package/fonts/font.woff2
my-package/fonts.scss
在fonts.scss中:
@font-face {
font-family: $myfont;
src:
url('./fonts/font.woff2') format('woff2'),
url('./fonts/font.woff') format('woff');
}
我已尝试将fonts.scss导入project.scss:
在project.scss
中@include "./my-package/fonts.scss";
然而,字体的路径是错误的。因为它只是一个SASS包含相对于project.scss的路径,所以它需要这个工作:
@font-face {
font-family: $myfont;
src:
url('./my-package/fonts/font.woff2') format('woff2'),
url('./my-package/fonts/font.woff') format('woff');
}
我可以让webpack导入SASS文件,以便它的变量等可用,还能让它更正字体文件的路径吗?自定义模块是我自己的,所以我可以更改它的代码,但我不想将其更改为荒谬的东西。
答案 0 :(得分:0)
我有同样的问题。您可以做的是创建一个 your-font.scss 文件以附加您的字体并将 your-font.scss 文件导入应用程序的基本文件中,而不是再次将它导入另一个.scss。这样你的网址就会正确。