我使用Yeoman的生成器创建了一个Angular项目,现在我正在尝试将Font Awesome添加到项目中.我使用Bower安装它
bower install fontawesome --save
然后它会自动添加到我app/index.html的以下代码中:
<!-- build:css(.) styles/vendor.css -->
<!-- bower:css -->
<link rel="stylesheet" href="bower_components/fontawesome/css/font-awesome.css" />
<!-- endbower -->
<!-- endbuild -->
但我不想将它用作CSS,而是用作SCSS导入(能够更改字体文件的URL).所以我从HTML页面删除了上面的代码,并将正确的代码添加到app/styles/main.scss:
$icon-font-path: "../bower_components/bootstrap-sass-official/assets/fonts/bootstrap/";
$fa-font-path: "../bower_components/fontawesome/fonts/"; // <==== here
// bower:scss
@import "bootstrap-sass-official/assets/stylesheets/_bootstrap.scss";
@import "fontawesome/scss/font-awesome.scss"; // <==== and here
// endbower
然后我跑了grunt build,但有些东西(Grunt？)将我的文件编辑回原来的文件.在index.html得到了<link>再次和我main.scss保持只与引导进口.
好的,我们快到了.
所以我查看了Bootstrap bower.json并与Font Awesome相比较bower.json,我发现了以下不同之处:
// Bootstrap
"main": [
"assets/stylesheets/_bootstrap.scss", // it's SCSS
...
],
// Font Awesome …