Vue.js Vue+；网页包，将字体文件转换为base64

我正在编写一个库来导入到其他项目中，以共享自定义组件和样式。 问题在于字体文件.woff/.ttf/等

//_fonts.scss
$woff_path: '~/woff';
$ttf_path: '~/ttf';

@font-face {
    font-family: "MyOpensans";
    src: url($woff_path + "opensans-regular-webfont.woff2") format("woff2");
    src: url($woff_path + "opensans-regular-webfont.woff") format("woff");
    src: url($woff_path + "OpenSans-Regular.ttf") format("font-type");
    font-style: normal;
...
}

$testfont: "MyOpensans", wingdings;

当我在我的SCS中使用$testfont时，url使用相对路径，这在导入到其他项目中时当然不起作用。所以，我的想法是使用base64：

src: url(data:application/x-font-woff;charset=utf-8;base64;XXXX);

如果我通过base64转换器运行.woff文件并粘贴到_fonts.scs中，效果很好。但是，我希望webpack为我做这件事。我尝试了base64内联加载程序和url加载程序。两者都不起作用。 使用url加载器进行更多挖掘。如果我导入“@/assets/woff/opensans regular.webfont.woff2”在my main.ts中，我可以看到它在主源代码中将其base64转换为变量，但是my _fonts.scss当然不知道这一点，my _fonts.scss仍然将src作为相对路径。似乎url加载器对SCS中的url（）没有任何作用

我错过什么了吗？有没有办法让我的网页包把我的url（文件路径）转换成url（数据：xxx）？或者通过其他方式让自定义字体在编译到库时工作