Upgrading webdependencies - Quasar and Node.Js 16 to Node.JS 22: class qualifiers are not added and HTML tag stil have <q-xxxx ...> instead off just HTML tag?

[nkamp]

Hello,

I'm upgrading the application from Node.Js 16 to Node.Js 22. I'm also upgrading the quasar dependencies:
"@quasar/extras": "^1.16.3" to "1.17.0"
"quasar": "2.11.10", to version "2.18.6"
We are using quasar as a plugin with Webpack in Vue 3.x. There is Quasar.conf.js created, which is importing app-main.scss. The quasar.fonf.js is imported in the main.ts ("import "./quasar-conf";).
My feeling is that after the upgrade of Node.JS and quasar, that quasar is not right loaded or...?

But now the css classes are not added like the quasar component <q header .../>
With Node.Js22/quasar 2.18.6 and I look in the 'Inspector' of the browser console than I see at the class element:
<q-header id="app" class="test-env text-white" .... />... </q-header>

In the version with Node.js version 16 with quasar version 2.11.10 it was:
<header id="app" class="q-header q-layout__section--marginal fixed-top test-env text-white" .... >.... </header>

So with Node.Js version 22 and Quasar 2.18.6 than:

• every HTML tag is the "q-" added to the HTML tag and not just rendered to <header class="..." ...>
• As said the class css part "q-header q-layout__section--marginal fixed-top" are not added to the HTML tag

Is in this Quasar version can't find the scss files? Has this been changed?

Further I get a lot of warnings, but I don't think that this is the issue:

warning in ./src/components/Topbar.vue?vue&type=style&index=0&id=61dd7a3d&lang=scss&scoped=true

Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Warning on line 0, column 8 of file:///C:/Users/.../node_modules/quasar/src/css/index.sass:0:8:
Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import

0 | @import './helpers/string.sass'

node_modules\quasar\src\css\index.sass 1:9 @import
src\components\Topbar.vue 3:19 root stylesheet