Estoy migrando mi aplicación vue 2.0 a vue 3.0. Siguiendo la guía, hice los cambios y se compila con éxito. Pero recibo un error en el componente snackbar. Mientras revisaba el problema, se debió a una nueva instancia de Vue(). He actualizado esa aplicación Vue 3.0. No soy capaz de entender cómo resolver eso.

Aquí está mi archivo js de evento snackbar. Donde se inicializó la instancia de vue.

 import Vue from 'vue' const events = new Vue(); export default events

Este es el index.js de snackbar como referencia.

 import urSnackbar from "./urSnackbar.vue"; import snacbkarEvent from "./snackbarEvents"; export default { install(Vue){ Vue.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); } }; Vue.prototype.$showSnackbar = showSnackbar; Vue.prototype.$addSnackbar = addSnackbar; } };

Este problema se reflejó al cambiar la configuración en vue.config.js para resolver las advertencias del proceso de migración.

Lo que cambié en vue.config.js por el cual ocurrió este problema

 configureWebpack: { resolve: { alias: { vue$: 'vue/dist/vue.esm-bundler.js' } } ..... }

Anteriormente, era (vue$: '@vue/compat'), así que recibí varias advertencias. Para esos, cambié como arriba.

¿Me pueden decir cómo puedo resolver este problema?