Nuxtjs: Adding Vuejs plugins doesn't get initialized/ shown on my template

Question

I am trying to add a vue-button-loading plugin to my project. I've installed the plugin properly and added the necessary configurations as instructed on nuxtjs on how to install the plugin.

Here is where I installed my plugin on nuxt.config.js file:

export default {
  ...
  plugins: [
      {
        src:'~/plugins/loading-button.js', mode: 'client'
      }
  ]
  ...
 }

And then I created loading-button.js under the plugins folder as follows:

import Vue from 'vue'
import VueLoadingButton from 'vue-loading-button'

Vue.use(VueLoadingButton)

Lastly, I load my button on the template with:

<VueLoadingButton />

But nothing seems to show. If I inspect I can see it is initialized.

Any help to resolve this will be greatly appreciated.

Sovai · Accepted Answer · 2022-01-20 09:07:35Z

1

try use vue.component instead

import Vue from 'vue'
import VueLoadingButton from 'vue-loading-button'

Vue.component('my-loading-button', VueLoadingButton)

and in your vue template

<my-loading-button :loading="true">Send</my-loading-button>

You can check live here https://codesandbox.io/s/practical-bartik-43e37?file=/plugins/loading-button.js

edited Jan 20, 2022 at 9:07

answered Jan 19, 2022 at 9:14

Sovai

1541 silver badge13 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

gxvr Over a year ago

Okay let me try

gxvr Over a year ago

Hello @Sovai I've tried but am getting the error: [Vue warn]: Unknown custom element: <VueLoadingButton> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Sovai Over a year ago

I've updated the answer. You can try again. Please mark it as answer if it works for you :)

gxvr Over a year ago

Hi @Sovai, thanks it works now. How can I trigger it to load on button click? as for now it shows loading icon always

Sovai Over a year ago

hi @gxvr sorry for the late reply. you can check the demo in my answer above. I have updated the code

|

Collectives™ on Stack Overflow

Nuxtjs: Adding Vuejs plugins doesn't get initialized/ shown on my template

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related