使用 nuxt 更改字体真棒图标颜色答案

【问题标题】：Change font awesome icon color with nuxt使用 nuxt 更改字体真棒图标颜色
【发布时间】：2020-02-29 07:33:59
【问题描述】：

如何更改 nuxt 中 fontawesome 图标的颜色？我给图标起了一个类名并设置了颜色：#444444" 但它似乎不起作用。虽然 font-size 属性适用于图标。

    <div class="icons">
      <font-awesome-icon
        :icon="['fab', 'github-square']"
        class="icons__btn icons__github"
      />
      <font-awesome-icon
        :icon="['fab', 'twitter-square']"
        class="icons__btn icons__twitter"
      />
    </div>

    .icons {
  margin-bottom: 5rem;
  &__btn {
    margin-top: 2rem;
    font-size: 5rem;
    color: red;
  }
  &__twitter {
    margin-left: 1rem;
  }
}

【问题讨论】：

你能发布代码吗？
使用代码示例编辑问题
我已经在 nuxt.js 项目中测试了 fontawesome，请看下面的答案。

标签： vue.js font-awesome nuxt.js

【解决方案1】：

你应该再次检查你的fontawesome模块是否加载正确，或者再次检查你的css代码是否编译正确。

我做了use fontawesome in nuxt的demo，希望对你有帮助。

【讨论】：