Error in callback for watcher "value": "TypeError: Cannot read property 'desktop' of undefined" found in <QMenu>

I have this problem when import a new QSelect component,

app.js:67460 [Vue warn]: Error in callback for watcher "value": "TypeError: Cannot read property 'desktop' of undefined" found in ---> <QMenu> <QSelect> <SearchForm> at resources/assets/js/forms/SearchForm.vue <Table> at resources/assets/js/components/Table.vue <Listar> at resources/assets/js/components/ListAdmin.vue <Admin> at resources/assets/js/pages/Admin.vue <QPageContainer> <QLayout> <Default> at resources/assets/js/layout/Default.vue <Main> at resources/assets/js/layout/Main.vue <Root>

I use quasar without quasar CLI in standalone way, my app file look that way

And when debug in the transpiled file app.js

Thanks

[shandrolis]

I’m getting the same error as above, except it only occurs when I compile my own component-library (that builds on top of quasar), and then import that into a different project.

My project is also a Vue app that plugs in Quasar.

However, I do correctly (to my knowledge) do Vue.use (quasar, {<options>}) in my main.ts, and all my packages are up-to-date with the latest versions of quasar.

The issue seems to originate from utils/escape-key.js that tries to make use of the Platform plugin.

After editing the (minified) file directly in my browser (console>sources tab in chrome) with some console.logs, I get the following.

If I change the if-statement as seen in the screenshot in my node-modules directly in both my component library and my web-app into the following, I can use the dropdowns (components that use q-menu) just fine! if (Platform.is === undefined || Platform.is.desktop === true) {

Obviously this would likely bug out the mobile view, so that’s not much of a permanent solution.

::edit:: On second thought, it makes much more sense to turn if (Platform.is === undefined || Platform.is.desktop === true) {

into

if (Platform.is !== undefined && Platform.is.desktop === true) {

[nikoz84]

If someone want the solution, i update de quasar extras, and in the app.js pass the Quasar object with the options. Thanks and sorry for my terrible english @rstoenescu @smolinari smolinari

import Vue from "vue";

import Quasar from "quasar";
import "quasar/dist/quasar.ie.polyfills.umd.min.js";
import lang from "quasar/lang/pt-br.js";
import materialIcons from "quasar/dist/icon-set/material-icons.umd.min.js";
import "@quasar/extras/roboto-font/roboto-font.css";
import "@quasar/extras/material-icons/material-icons.css";

Vue.use(Quasar, {
  lang,
  iconSet: materialIcons
});