如何将webfonts正确地包含到引导-sass项目中？

Question

我创建了一个带有yeoman生成器的引导-sass项目。

我想添加一个get字体，每次我编译我的scss代码时，我都会得到以下错误：

错误app/src/样式表/main.scss(第25行:文件未找到或无法读取: /Users/username/Desktop/testfolder/fonts/../fonts/nexa-webfont/nexaheavy-webfont.woff) )

我怎样才能摆脱不必要的../testfolder/fonts/..路径中的文件夹？

我的main.scss看起来是这样的：

// VER: 0.1

/* OVERRIDDEN BOOTSTRAP VARIABLES */
$icon-font-path: "../fonts/bootstrap/";

/* STANDARD INCLUDES */
@import "bootstrap-compass";
@import "bootstrap-sprockets";
@import "bootstrap";
@import "compass/css3";

/* CUSTOM FONT IMPORT */
@include font-face(
  "Nexa Heavy",
  inline-font-files(
    '../fonts/nexa-webfont/nexaheavy-webfont.woff', woff,
    '../fonts/nexa-webfont/nexaheavy-webfont.ttf', ttf,
    '../fonts/nexa-webfont/nexaheavy-webfont.svg', svg),
    '../fonts/nexa-webfont/nexaheavy-webfont.eot',
  normal, // font-weight
  normal  // font-style
);


/* CUSTOM INCLUDES */
@import "custom-variables";
@import "common";
@import "navigation";
@import "footer";

@import "pages/home";

Answer 1

在导入字体时，我们使用：

@font-face {
  font-family: "diogenesregular";
  src: asset-url("assets/diogenes-webfont.eot");
  src: asset-url("assets/diogenes-webfont.eot?#iefix") format("embedded-opentype"),
  asset-url("assets/diogenes-webfont.woff2") format("woff2"),
  asset-url("assets/diogenes-webfont.woff") format("woff"),
  asset-url("assets/diogenes-webfont.ttf") format("truetype"),
  asset-url("assets/diogenes-webfont.svg#diogenesregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

但不太确定你的设置或字体套件。我们将所有字体放在app/assets/fonts中，然后像上面这样导入app/assets/stylesheets/fonts.scss中的字体，然后在application.scss中导入这个文件。