图标字体不适用于localhost但使用file：//它可以正常工作

Question

我从Trello下载了Icon字体并将其包含在我的SASS文件中，但是当我使用localhost打开页面时，它无法正常工作。我试图使用https：//链接到字体。

在我的SASS文件中，我包含Roboto字体，它工作正常。

@import "bourbon"
+font-face("RobotoRegular", "../fonts/RobotoRegular/RobotoRegular", $file-formats: woff )
+font-face("trellicons", "../fonts/trellicons/trellicons", $file-formats: woff )

另外我注意到当我在Mozilla中通过file：//协议打开我的页面时它可以工作（它还没有镀铬）。

控制台显示一个错误：

  

加载连接时   WS：//本地主机：3000 /浏览器的同步/ socket.io / EIO = 3及运输=网页套接字＆安培; SID = 4Wak5Q FtkPTXAfXXAAAC   被打断了。

但我不认为这是问题所在。没有任何403/404/500请求。我还注意到，当我在控制台中打开样式时，我的图标字体没有@ font-face，因此浏览器可能不会尝试加载它。我通过添加简单的CSS文件来解决这个问题，我在其中写了@ font-face for icon字体并且它有效，但我仍然很好奇为什么它不能与SASS一起使用。我没有任何SASS语法错误。我尝试过不同的方法来包含它，但没有任何作用。

编译的CSS看起来像这样：

@font-face{
    font-family:trellicons;
    font-style:normal;
    font-weight:400;
    src:url(../fonts/trellicons/trellicons.woff) format("woff")
}

我将整个项目放在github。