Vuefire with Vue 3 throwing Vue.use error

Question

So I created a vue app and imported Vue from vue module but I am getting this error

ERROR in src/main.ts:4:5
TS2339: Property 'use' does not exist on type 'typeof import("/data/data/com.termux/files/home/ishankbg.tech/node_modules/vue/dist/vue")'.
    2 | import App from './App.vue'
    3 | import { firestorePlugin } from 'vuefire';
  > 4 | Vue.use(firestorePlugin);
      |     ^^^
    5 | createApp(App).mount('#app');
    6 |

I am using typescript in my vue app. I generated the project using @vue/cli. I want to use firestorePlugin from vuefire.

I am using Vue3 Here is the source code

import Vue, { createApp } from 'vue'
import App from './App.vue'
import { firestorePlugin } from 'vuefire';
Vue.use(firestorePlugin);
createApp(App).mount('#app');

I am not sure what's causing this error

Dan · Accepted Answer · 2021-03-03 01:48:07Z

1

Vuefire isn't supported in Vue 3 yet. From the main page:

Note: This version currently supports Vue 2 and Firebase 7. Support for Vue 3 / Composition API and Firebase 8 is on the way.

Vue.use is the Vue 2 way of installing plugins. Once Vuefire supports Vue 3, use app.use instead of Vue.use. In Vue 3, Vue is not a valid export from the "vue" package:

import { createApp } from 'vue'
import App from './App.vue'
import { firestorePlugin } from 'vuefire';

const app = createApp(App);
app.use(firestorePlugin);
app.mount("#app");

edited Mar 3, 2021 at 1:48

answered Mar 2, 2021 at 12:08

Dan

63.5k18 gold badges113 silver badges122 bronze badges

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

3 Comments

Vixson Over a year ago

Thank @dan but would you have an idea of how to Vue.use (app.use) plugins on individual components.

Dan Over a year ago

@Vixson It doesn't really work that way. Plugins are basically just global-level functions that run when loading the app, so maybe you need to rethink what you're trying to do. v3.vuejs.org/guide/plugins.html

Vixson Over a year ago

Ok @Dan thank, I got that point already. It's just that Migrating from Vue 2 to Vue 3. I got some break changes. On Vue 2, I normally import plugins I'll need only on the component I'll need it. Now on Vue 3, I was just lost on how to go about it.

Collectives™ on Stack Overflow

Vuefire with Vue 3 throwing Vue.use error

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related