一些 vue bootstrap-vue 图标不适用于 nuxt

Question

到目前为止，我正在使用 Nuxt 和 bootstarp-vue，所有组件都按预期工作。但是一些 bootstrap-vue 图标没有显示出来

index.vue

<b-icon-arrow-up></b-icon-arrow-up>
<b-icon icon="bar-chart-fill"></b-icon>
<b-icon icon="cart"></b-icon>

nuxt.config.js

modules: [
    'bootstrap-vue/nuxt',
],
bootstrapVue: {
    icons: true,
},

b-icon-arrow-up 和 b-icon icon="bar-chart-fill" 都在工作并作为 SVG 进入 DOM。只有b-icon icon="cart" SVG 标记中有一个空的g。我还尝试了更多的图标以及相机，斜线圆圈和警报，后退图标不像购物车那样出现。

我也尝试过像这样从 bootstarp-vue 中将购物车作为单个组件拉出来，

import { BIcon, BIconCart } from 'bootstrap-vue'
.....
export default {
  components: {
    BIcon,
    BIconCart
  },
....

这也不起作用，我只是报错说找不到组件BIconCart

Answer 1

您使用的BootstrapVue 版本可能没有您要查找的图标，因此请尝试将BootstrapVue 更新到最新版本。

你可以在图标页面https://bootstrap-vue.org/docs/icons看到哪个版本的BootstrapVue包含哪个版本的Bootstrap-Icons。

截至本文的当前参考：

• Bootstrap 图标在 v2.2.0 版本中被引入 BootstrapVue。
• Bootstrap 图标 v1.0.0-alpha3 已添加到 BootstrapVue v2.8.0。
• Bootstrap 图标 v1.0.0-alpha4 已添加到 BootstrapVue v2.15.0。
• BootstrapVue v2.16.0 中添加了引导图标 v1.0.0-alpha5。
• Bootstrap 图标 v1.0.0 已添加到 BootstrapVue v2.17.0。
• Bootstrap 图标 v1.1.0 已添加到 BootstrapVue v2.19.0。
• Bootstrap 图标 v1.2.0 已添加到 BootstrapVue v2.21.0。