波旁sass字体面字体位置npm编译错误

我正在使用和使用他们的

看下面我的俏皮话

$panton: (

    ("Panton-Light-Italic", 'italic', 300),
    ("Panton-Light", 'normal', 300),

    ("Panton-Regular", 'normal', 400),
    ("Panton-Regular-Italic", 'italic', 400),

    ("Panton-Bold", 'normal', 600),
    ("Panton-Bold-Italic", 'italic', 600),

);

@each $p in $panton {
  @include font-face(
      "Panton",
      "../fonts/panton/#{nth($p,1)}",
          ("woff2", "woff")
  ) {
    font-style: #{nth($p,2)};
    font-weight: #{nth($p,3)};
  }
}

但我在编译和获取此错误时遇到问题

ModuleNotFoundError:未找到模块：错误：无法解析 “../../node_modules/bourbon/core/bourbon/fonts/panton/panton Bold Italic.woff” 在“/Users/joshcranwell/Sites/werksmotorsport-v2/src/scss”中

出于某种原因，它在bourbon node_modules文件夹中查找字体，而实际上它位于此处

这是我的webpack.mix.js，它完全适用于字体，无需添加变量覆盖。我所有需要的字体都会按预期编译到发行版中

 mix.js('src/js/theme.js', 'dist/js')
    .js('src/js/dashboard.js', 'dist/js')
    .sass('src/scss/screen.scss', 'dist/css')
    .sass('src/scss/dashboard.scss', 'dist/css')
    .setPublicPath('dist')
    .setResourceRoot('../');

但有些人在使用波旁字体时没有编译

任何帮助都会很棒

更新

如果我在它编译的url上使用~/../fonts/panton/{nth$p，1}，但不将字体移动到分发文件夹

另外，控制台错误显示奇数位置无dist文件夹

---

也许不是你想要的答案，但我怀疑这是波旁威士忌与Webpack之间的冲突。这可能比它的价值更难诊断——除非你在整个项目中大量使用波旁威士忌？我想说它相对来说是冗余的，您可以用不太多的代码来实现这一点-

$panton: (

    ("Panton-Light-Italic", 'italic', 300),
    ("Panton-Light", 'normal', 300),

    ("Panton-Regular", 'normal', 400),
    ("Panton-Regular-Italic", 'italic', 400),

    ("Panton-Bold", 'normal', 600),
    ("Panton-Bold-Italic", 'italic', 600),

);

@each $p in $panton {
  @font-face {
    font-family: "Panton";
    src: url("../fonts/panton/#{nth($p,1)}.woff2") format('woff2'),
         url("../fonts/panton/#{nth($p,1)}.woff") format('woff'),
    font-style: #{nth($p,2)};
    font-weight: #{nth($p,3)};
  }
}

也许试一试吧