CODEWITHSUNDEEP
vue.jsquasar-frameworkquasar
Maarten Coppens
Maarten Coppens

Reputation: 199

This in a Quasar project and node module not able to access this.$q

I'm having trouble accessing Quasar's this.$q in a node module and using it as a boot plugin in the Quasar CLI.

I have a component where I start my QLayout where I can access this.$q when I put a console.log(this.$q) in the created part of that component I can access the information. But receive various errors of QLayout not being able to access that same information.

Vue warn]: Error in data(): "TypeError: Cannot read property 'screen' of undefined"

found in

---> <QLayout>
       <DlLayoutMenu> at node_modules/frontend-modules/src/components/system/components/DlLayoutMenu.vue
         <App> at src/App.vue
           <Root>
vue.runtime.esm.js?794d:1888 TypeError: Cannot read property 'screen' of undefined
    at VueComponent.data (QLayout.js?2d21:37)
    at VueComponent.mergedDataFn (vue.runtime.esm.js?794d:1219)
    at getData (vue.runtime.esm.js?794d:4748)
    at initData (vue.runtime.esm.js?794d:4705)
    at initState (vue.runtime.esm.js?794d:4642)
    at VueComponent.Vue._init (vue.runtime.esm.js?794d:5006)
    at new VueComponent (vue.runtime.esm.js?794d:5154)
    at createComponentInstanceForVnode (vue.runtime.esm.js?5593:3283)
    at init (vue.runtime.esm.js?5593:3114)
    at createComponent (vue.runtime.esm.js?5593:5978)

So I put a debugger on line 35 in QLayout.js and debug manually what the this object has but it's totally different and does not contain the key $q.

Upvotes: 0

Views: 1177

Answers (2)

1_1
1_1

Reputation: 1

I had same problem, resolve - reinstall by git pack docs

ttps://github.com/quasarframework/vue-cli-plugin-quasar

Upvotes: 0

Maarten Coppens
Maarten Coppens

Reputation: 199

I could fix it, it took me a while to understand what was happening. But I created two Quasar projects with the cli. The parent project contained quasar and the module aswell. Without specifying and actually without really using quasar in the module it took the QLayout from the module node_modules. I could see this hard-coding a console.log inside the QLayout.js and debugging which one it was actually using. How it took this one I really don't know. However taking everything Quasar related outside the module made it work. This has some downsides that if I wanted to do something specifically inside that package without it's parent it wouldn't work...

Upvotes: 1

Related Questions