我正在尝试使用SASS @import
使用此行加载FontAwesome:
@import "../node_modules/font-awesome/scss/font-awesome";
并继续在控制台中收到这些错误,而不是加载FA图标:
olympos.min.js?ver = 1.0:1 GET http://test.dev/wp-content/themes/fonts/fontawesome-webfont.woff2?v=4.7.0 net :: ERR_ABORTED(匿名)@ olympos.min.js?ver = 1.0:1(匿名)@ olympos.min.js?ver = 1.0:1(匿名)@ olympos.min.js?ver = 1.0:1
(指数):1 GET http://test.dev/wp-content/themes/fonts/fontawesome-webfont.woff?v=4.7.0 净:: ERR_ABORTED
(指数):1 GET http://test.dev/wp-content/themes/fonts/fontawesome-webfont.ttf?v=4.7.0 净:: ERR_ABORTED
我尝试过关注FontAwesomes网站上的original documentation并且结果相似 - 我更改了文件node_modules/font-awesome/scss/_variables.scss
变量:$fa-font-path: "../fonts" !default;
但注意到它是< / strong>指向包含字体的正确/ fonts文件夹。
尝试通过将gulpfile.js
添加到我的sass任务而不是来自我的项目scss font-awesome.scss
文件中,从我的_fonts.scss
加载它。
这是我当前的本地_fonts.scss
文件之后的一些变化:
@import "../node_modules/font-awesome/scss/font-awesome";
$fa-font-path: "../node_modules/font-awesome/fonts" !default;
@import "../node_modules/font-awesome/scss/font-awesome.scss";
@font-face {
font-family: 'FontAwesome';
src: url('../node_modules/font-awesome/fonts/fontawesome-webfont.eot?v=4.7.0');
src: url('../node_modules/font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype');
src: url('../node_modules/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2');
src: url('../node_modules/font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff');
src: url('../node_modules/font-awesome/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype');
src: url('../node_modules/font-awesome/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
font-weight: normal;
font-style: normal;
}
在审核此帖How do I load font-awesome using SCSS (SASS) in Webpack using relative paths?
之后我得不到合适的结果。
我来到这篇文章:"NetworkError: 404 Not Found fontawesome-webfont.woff?v=4.0.3
...提到它可能是一个Apache2服务器修复程序(我不太确定将代码部分添加到我的etc/apache2/sites-available/test.conf
?)
我还没有测试过这个选项,但问题是 - 如果这在我的localhost本地工作,将这个更改应用到我的客户端页面可能会有问题(生产网站托管在我无法更改任何内容的服务器上apache配置 - 由于糟糕的托管公司服务)。
还有其他解决方案吗?也许将此代码部分(或任何其他)添加到.htaccess文件中?
此案例有哪些可行的解决方案?
使用Ubuntu 16.04 - gulp - SASS - NPM
随时请求更多可能有助于我帮助的信息,我将更新我的帖子