Tengo una aplicación Quasar y parece que tengo un problema extraño. Estoy tratando de definir una variable global que es un objeto que solo contiene metainformación sobre la aplicación. La aplicación se compila por completo y la información correcta aparece en el HTML, pero aparece un error en VSCode.
src/boot/BackChat.js
import { boot } from 'quasar/wrappers'; const version = '0.0.0'; const backChat = { version }; export default boot(({ app, router, store }) => { app.config.globalProperties.backChat = backChat; });Login.vue
// ... <script> import { ref } from 'vue'; export default { data() { return { backChat: this.backChat }; } } </script>¿Estoy usando esta interfaz de forma incorrecta o es solo un error con la validación del archivo Vue? Parece que piensa que "backChat" en Login.vue es una función. Si cambio los datos () a montados (), ya no es una función, pero no puedo acceder a ellos en el DOM. Soy muy nuevo en Vue.
Tengo una solución que es el enfoque más simple. No estoy seguro de si es así como se supone que debes hacerlo, pero como estaba pensando que era una función, hice de globalProperty una función que devuelve el objeto.
src/boot/BackChat.js
// ... export default boot(({ app, router, store }) => { app.config.globalProperties.$backChat = () => backChat; });Login.vue
// ... data() { return { username, password, backChat: this.$backChat() }; },Esto corrige el error resaltado en el archivo Vue y permite el mismo uso del objeto global.