font-awesome和less:图标类无法识别

时间:2014-08-25 15:41:50

标签: less font-awesome font-awesome-4

我有一个main.less文件,我试图使用font-awesome类进行编译。

我的文件很简单:

@import "../bower_components/bootstrap/less/bootstrap.less";
@import "../bower_components/fontawesome/less/font-awesome.less";

.button {
    .btn;
    .btn-sm;
    .btn-primary;
    span {
        .fa;
        .fa-folder-open;
    }
}

我使用grunt-contrib-less提供的less编译器。

输出结果为:

>> NameError: .fa-folder-open is undefined in less/main.less on line 10, column 3:
>> 9           .fa;
>> 10          .fa-folder-open;
>> 11      }
Warning: Error compiling less/main.less Use --force to continue.

Aborted due to warnings
  • 更少版本:1.7.4
  • Grunt-contrib-less版本:0.11.4
  • 字体版本:4.1.0

问题出在哪里?

1 个答案:

答案 0 :(得分:1)

我找到的唯一解决方案是修改Font-awesome的文件图标。 我换了

.@{fa-css-prefix}-home:before { content: @fa-var-home; }

.@{fa-css-prefix}-home { &:before { content: @fa-var-home; } }