I have tried to migrating my application vue 2 to vue 3 by using migrating build official documentation.
I am configuring the files as it is suggested. There is no error while compilation and build is successful as well. But, i get multiple warning related to this in my console as i am using (@vue/compat).
As per official documentation, i have replaced vue prototype properties with app.config.globalProperties in everywhere but still i am getting the warning in console.
Here is my code
import urSnackbar from "./urSnackbar.vue";
import urGlobalSnackbar from "./urGlobalSnackbar";
import snacbkarEvent from "./snackbarEvents";
export default {
install(app){
app.component(urSnackbar.name, urSnackbar);
if (this.installed) {
return
}
this.installed = true;
const showSnackbar = (params) => {
if (typeof params === 'string') {
params = { title: '', text: params }
}
if (typeof params === 'object') {
snacbkarEvent.$emit('show-snackbar', params);
}
};
const addSnackbar = (params) => {
if (typeof params === 'string') {
params = { title: '', text: params }
}
if (typeof params === 'object') {
snacbkarEvent.$emit('add-snackbar', params);
}
};
app.config.globalProperties.$showSnackbar = showSnackbar;
app.config.globalProperties.$addSnackbar = addSnackbar;
}
};
After updating as documented in official docs, i am getting those same warnings in console.
Warning
1. [Vue warn]: (deprecation GLOBAL_EXTEND) Vue.extend() has been removed in Vue 3. Use defineComponent() instead.
2.[Vue warn]: (deprecation GLOBAL_MOUNT) The global app bootstrapping API has changed: vm.$mount() and the "el" option have been removed. Use createApp(RootComponent).mount() instead.