Question

有人可以让我知道一些如何使用NPM向Buefy添加和配置Font Awesome 5字体的示例。

有关此文档的文档很少。谢谢！

https://buefy.github.io/documentation/start

Answer 1

要使用NPM代替CDN：

安装nuxt-fontawesome。

npm i nuxt-fontawesome
npm i @fortawesome/fontawesome-svg-core @fortawesome/vue-fontawesome

安装图标集，例如：

npm i @fortawesome/free-solid-svg-icons

按如下所示编辑nuxt.config.js：

modules: [
  'nuxt-buefy',
  'nuxt-fontawesome'
],
buefy: {
  materialDesignIcons: false,
  defaultIconPack: 'fas',
  defaultIconComponent: 'font-awesome-icon'
},
fontawesome: {
  imports: [
    {
      set: '@fortawesome/free-solid-svg-icons',
      icons: ['fas']
    }
  ]
}

用法示例：

<b-icon pack="fas" icon="home" size="is-large" />

Answer 2

我在 nuxt.config.js 中是这样工作的：

  modules: [
    '@nuxtjs/axios',
    '@nuxtjs/router',
    ['nuxt-buefy', {
      css: false,
      materialDesignIcons: false,
      defaultIconComponent: 'vue-fontawesome',
      defaultIconPack: 'fas',
    }],
  ],

如果您阅读 nuxt-buefy 文档，它会显示两种方式：

{
  modules: [
    // Simple usage
    'nuxt-buefy',

    ['nuxt-buefy', { /* buefy options */ }]
 ]
}

或

{
  modules: [
    // Simple usage
    'nuxt-buefy',
 ],
 buefy: { /* buefy options */ }
}

https://github.com/buefy/nuxt-buefy

如何在Buefy中配置Font Awesome

2 个答案: