Setting up bootstrap-vue with Nuxt.js

Question

I made a fresh install of Nuxt.js with bootstrap-vue/nuxt module which was properly added to nuxt.config.js. But now, when I add an element like <v-btn text>foo</v-btn> to my index page, I get the following error message in the javascript console:

[Vue warn]: Unknown custom element: <v-btn> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <Anonymous>
       <Nuxt>
         <Layouts/default.vue> at layouts/default.vue
           <Root>

How should I fix it ?

Hiws · Accepted Answer · 2020-03-31 21:40:47Z

1

<v-btn> is not a Bootstrap-Vue component. <b-button> or <b-btn> is however. You might be confusing Vuetify with Bootstrap-Vue. Or maybe you just have a typo since v and b is right next to eachother.

answered Mar 31, 2020 at 21:40

Hiws

10.7k2 gold badges24 silver badges39 bronze badges

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

1 Comment

DevonDahon Over a year ago

Indeed, I was confusing Vuetify with Bootstrap-Vue. Thanks!

Collectives™ on Stack Overflow

Setting up bootstrap-vue with Nuxt.js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related