Vue.js 字体awesome spinner微调器不旋转

发布于09月17日

我已经用这个奇妙的链接在Nuxt中完成了fontawesome的安装；

https://github.com/FortAwesome/vue-fontawesome

我将微调器渲染为

<font-awesome-icon :icon="['fas','spinner']" />

旋转器不旋转，它是静态的.

我加了足总旋转

<font-awesome-icon :icon="['fas','spinner', 'spin']" />

这导致了控制台Could not find one or more icon(s) undefined中的错误

谁能给我指出正确的方向，告诉我如何让我的旋转器旋转.

nuxt.config.js页上的相关部分

    modules: [
        'nuxt-fontawesome'
],


//font-awesome
  fontawesome: {
    imports: [
        {
          set: '@fortawesome/free-solid-svg-icons',
          icons: ['fas']
        },
    ],
  },

build: {
      config.resolve.alias['@fortawesome/fontawesome-free-brands$'] = '@fortawesome/fontawesome-free-brands/shakable.es.js'
      config.resolve.alias['@fortawesome/fontawesome-free-solid$'] = '@fortawesome/fontawesome-free-solid/shakable.es.js'
    }

在组件("../pages/index.vue")中，它是；

<template>
  <div>
    <font-awesome-icon :icon="['fas','spinner','spin' ]" />
  </div>
</template>

根据@Steve的建议，我创建了一个故障工作区

/* Define an animation behavior */ @keyframes spinner { to { transform: rotate(360deg); } } /* This is the class name given by the Font Awesome component when icon contains 'spinner' */ .fa-spinner { /* Apply 'spinner' keyframes looping once every second (1s) */ animation: spinner 1s linear infinite; }

Vue.js 字体awesome spinner微调器不旋转

推荐答案

Vue.js相关问答推荐

VUE：带自定义组件的数组输入绑定

我可以手动访问 vue-router 解析器吗？

保持页面重新加载之间的状态

仅在构建时为 Vue3 和 TailwindCSS 添加前缀

如何从 Vuex 状态使用 Vue Router？

如何根据生产或开发模式读取不同的 .env 文件？

Vue-Router 抽象父路由

单击复选框后，V-model 未更新

我可以使用 vue.js v-if 来判断值是否存在于数组中

不需要提交Mutations的 vuex 操作

Vue更改宽度和内容

如何在 Vue 类组件中定义过滤器？

我可以修改 Vue.js VNodes 吗？

Select 下拉列表中的复选框后如何清除 v-autocomplete(多个)搜索输入？

即使在生产模式下构建，VueJS 也会显示开发模式开发模式消息

带有后退按钮的 Vue.js 路由

vue-cli-service build --target lib 导入为 lib 时丢失图像路径

找不到模块 'babel-core' 但已安装 @babel/core

使计算的 Vue 属性依赖于当前时间？

何时使用与