Quasar app-vite usePolling issue. quasar.config.js

[stillnurs]

What happened?

Hot reload was not working. Tried to set "extendViteConf.usePolling" to true.

extendViteConf(viteConf) {
        viteConf.server.watch.usePolling = true;
      },
      

App cannot run, receiving error.

What did you expect to happen?

Expected to run my app, but getting current error.

"viteConf.server.watch.usePolling = true;
^

TypeError: Cannot set properties of undefined (setting 'usePolling')"

Reproduction URL

https://stackblitz.com/edit/quasarframework-po5slw?file=quasar.config.js

How to reproduce?

In quasar.config.js
Set build settings:

extendViteConf(viteConf) {
 viteConf.server.watch.usePolling = true;
}

Then run the app.

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Quasar CLI Commands/Configuration (@quasar/cli | @quasar/app-webpack | @quasar/app-vite), TypeScript Support, SPA Mode

Platforms/Browsers

No response

Quasar info output

Operating System - Windows_NT(10.0.22631) - win32/x64
NodeJs - 20.10.0

Global packages
  NPM - 10.8.0
  yarn - Not installed
  @quasar/cli - 2.4.1
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.16.9 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 1.9.5 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.16.12 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.5.0 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.4.3
  pinia - 2.2.2 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  vite - 2.9.18 -- Native-ESM powered web dev build tool
  eslint - 8.57.0 -- An AST-based pattern checker for JavaScript.
  electron - Not installed
  electron-packager - Not installed
  @electron/packager - Not installed
  electron-builder - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Relevant log output

No response

Additional context

No response

[Dtsiantaris]

The correct syntax is viteConf.server.watch = { usePolling: true }.

When doing watch.usePolling = true, you assume that watch is not undefined, which is the case here.

[yusufkandemir]

As @Dtsiantaris pointed out, the config might be undefined and the error is precisely pointing to that. However, the solution above is not the safest as watch can be filled in the future, but you would override all the properties. So, the safest way would be this:

import { mergeConfig } from 'vite' // or require() equivalent

// ...
extendViteConf(viteConf) {
  viteConf.server = mergeConfig(viteConf.server, {
    watch: {
      usePolling: true,
    }
  })
},