Vue CLI: Why does createApp work but Vue.createApp doesn't?

436 Views Asked by At

I'm confused about the difference between the CLI version of Vue.js and the normal version where you use a Vue istance.

On the initial build, the App.js file looks something like this:

import { createApp } from 'vue'
import { App } from './App.vue'

createApp(App).mount('#app')

and the app works fine.

But if I try to change it slightly and use:

import { Vue } from 'vue'
import { App } from './App.vue'

Vue.createApp(App).mount('#app')

all I get is a blank page.

I've been wanting to add a prototype to the Vue instance to access a global variable, but I don't see how if you can't use the Vue class normally.

What's the difference in functionality on the vue-cli when using Vue.createApp and createApp?

1

There are 1 best solutions below

0
Boussadjra Brahim On BEST ANSWER

Since you're using the vue cli, the first syntax is correct because there's no Vue object imported from vue, for more explanation check this answer. To add a global variable try to use app.config.globalProperties.$globalVar :

import { createApp } from 'vue'
import { App } from './App.vue'

let app=createApp(App)
app.config.globalProperties.$globalVar=555;
app.mount('#app')