deprecation warnings in quasar/src/css/variables.sass' #17581

Crypto69 · 2024-10-17T10:48:48Z

What happened?

Created a new app using cli.
When you run the app with quasar dev you get a number of deprecation warning
» App URL................ http://localhost:9000/
http://192.168.1.225:9000/
» Dev mode............... spa
» Pkg quasar............. v2.17.0
» Pkg @quasar/app-vite... v1.10.0
» Browser target......... es2019|edge88|firefox78|chrome87|safari13.1

App • Opening default browser at http://localhost:9000/

Deprecation Warning on line 7, column 9 of node_modules/quasar/dist/quasar.sass:
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
╷
7 │ @import 'src/css/quasar.variables.scss'
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵

Deprecation Warning on line 8, column 9 of node_modules/quasar/dist/quasar.sass:
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
╷
8 │ @import 'quasar/src/css/variables.sass' etc...

What did you expect to happen?

It should just run without these warnings

Reproduction URL

https://github.com/Crypto69/quasarissue

How to reproduce?

Create a new quasar app using the CLI

quasar dev

Flavour

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

Areas

Quasar CLI Commands/Configuration (@quasar/cli | @quasar/app-webpack | @quasar/app-vite), Directives (quasar), Style & Identity (quasar)

Platforms/Browsers

No response

Quasar info output

quasar info

Operating System - Darwin(24.0.0) - darwin/arm64
NodeJs - 21.5.0

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

Important local packages
  quasar - 2.17.0 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 1.10.0 -- 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.12 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.4.5
  pinia - 2.2.4 -- 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.1 -- 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*

Networking
  Host - Mac
  en1 - 192.168.1.225

Relevant log output

» App URL................ http://localhost:9000/
                           http://192.168.1.225:9000/
 » Dev mode............... spa
 » Pkg quasar............. v2.17.0
 » Pkg @quasar/app-vite... v1.10.0
 » Browser target......... es2019|edge88|firefox78|chrome87|safari13.1

 App • Opening default browser at http://localhost:9000/

Deprecation Warning on line 7, column 9 of node_modules/quasar/dist/quasar.sass: 
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
  ╷
7 │ @import 'src/css/quasar.variables.scss'
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵

Deprecation Warning on line 8, column 9 of node_modules/quasar/dist/quasar.sass: 
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
  ╷
8 │ @import 'quasar/src/css/variables.sass'
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵

Deprecation Warning on line 1, column 9 of src/css/app.scss: 
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
  ╷
1 │ @import 'src/css/quasar.variables.scss';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵

Deprecation Warning on line 2, column 9 of src/css/app.scss: 
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
  ╷
2 │ @import 'quasar/src/css/variables.sass';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
42 │ $breakpoint-xs-max: (map-get($sizes, "sm") - 0.02) !default
   │                      ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 42:22  @import
    src/css/app.scss 2:9                              root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
44 │ $breakpoint-sm-min: map-get($sizes, "sm") !default
   │                     ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 44:21  @import
    src/css/app.scss 2:9                              root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
45 │ $breakpoint-sm-max: (map-get($sizes, "md") - 0.02) !default
   │                      ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 45:22  @import
    src/css/app.scss 2:9                              root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
47 │ $breakpoint-md-min: map-get($sizes, "md") !default
   │                     ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 47:21  @import
    src/css/app.scss 2:9                              root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
48 │ $breakpoint-md-max: (map-get($sizes, "lg") - 0.02) !default
   │                      ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 48:22  @import
    src/css/app.scss 2:9                              root stylesheet

Warning: 9 repetitive deprecation warnings omitted.

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
42 │ $breakpoint-xs-max: (map-get($sizes, "sm") - 0.02) !default
   │                      ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 42:22  @import
    node_modules/quasar/dist/quasar.sass 8:9          root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
44 │ $breakpoint-sm-min: map-get($sizes, "sm") !default
   │                     ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 44:21  @import
    node_modules/quasar/dist/quasar.sass 8:9          root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
45 │ $breakpoint-sm-max: (map-get($sizes, "md") - 0.02) !default
   │                      ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 45:22  @import
    node_modules/quasar/dist/quasar.sass 8:9          root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
47 │ $breakpoint-md-min: map-get($sizes, "md") !default
   │                     ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 47:21  @import
    node_modules/quasar/dist/quasar.sass 8:9          root stylesheet

Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.
Use map.get instead.

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

   ╷
48 │ $breakpoint-md-max: (map-get($sizes, "lg") - 0.02) !default
   │                      ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/quasar/src/css/variables.sass 48:22  @import
    node_modules/quasar/dist/quasar.sass 8:9          root stylesheet

Warning: 56 repetitive deprecation warnings omitted.

Additional context

No response

github-actions · 2024-10-17T10:49:08Z

Hi @Crypto69! 👋

It looks like you provided an invalid or unsupported reproduction URL.
Do not use any service other than Codepen, jsFiddle, StackBlitz, Codesandbox, and GitHub.
Make sure the URL you provided is correct and reachable. You can test it by visiting it in a private tab, another device, etc.
Please edit your original post above and provide a valid reproduction URL as explained.

Without a proper reproduction, your issue will have to get closed.

Thank you for your collaboration. 👏

Crypto69 · 2024-10-17T10:50:30Z

It doesn't seem to reproduce

Crypto69 · 2024-10-17T10:56:43Z

I copied the code to the repo https://github.com/Crypto69/quasarissue

rstoenescu · 2024-10-17T11:09:43Z

Please also upgrade to latest @quasar/app-vite (we've put this in the release notes as well).

rstoenescu · 2024-10-17T11:11:15Z

Ah, wait. You are already on the latest version. Checking out what Sass has changed...

…#17581

rstoenescu · 2024-10-17T11:55:54Z

Fixes available in:

q/app-webpack v3.14.1 & v4.0.0-beta.24
q/app-vite v1.10.1 & v2.0.0-beta.23

Just released them.

zanzara · 2024-10-17T14:11:39Z

@rstoenescu does this help also for that AE from Jeff? quasarframework/quasar-ui-qmarkdown#399 (comment)

rstoenescu · 2024-10-17T16:01:10Z

@zanzara yes, it should (in theory)

zanzara · 2024-10-17T18:00:41Z

@zanzara yes, it should (in theory)

Unfortunately it doesn't :-( And with latest app-vite-beta.23 I got even more warnings now.

muhamadamin1992 · 2024-10-18T10:31:15Z

@zanzara yes, it should (in theory)

Unfortunately it doesn't :-( And with latest app-vite-beta.23 I got even more warnings now.

On beta 22 I didn't have this error after upgrade to 23 I have warnings
Future import deprecation is not yet active, so silencing it is unnecessary.

rstoenescu · 2024-10-18T10:34:31Z

If you get into trouble, just do a clean install with the latest beta.
If we didn't silence the import warning you'd still have it in the console, so it is necessary.

zanzara · 2024-10-18T10:53:03Z

Yes, confirm it. A clean did work.

LuckDogHu · 2024-10-19T03:36:58Z

The same problem happened with Vite plugin for Quasar, how to solve it

rstoenescu · 2024-10-19T13:52:22Z

@LuckDogHu Upgrade to @quasar/vite-plugin v1.8.0 (and read the release notes on Sass dep).

LuckDogHu · 2024-10-19T14:07:42Z

thank you. it work well @rstoenescu

Crypto69 added kind/bug 🐞 Qv2 🔝 Quasar v2 issues labels Oct 17, 2024

github-actions bot added area/cli area/directives area/style bug/0-needs-info Need more info to reproduce flavour/quasar-cli-vite labels Oct 17, 2024

Crypto69 closed this as completed Oct 17, 2024

Crypto69 reopened this Oct 17, 2024

Crypto69 closed this as completed Oct 17, 2024

Crypto69 reopened this Oct 17, 2024

rstoenescu closed this as completed Oct 17, 2024

rstoenescu reopened this Oct 17, 2024

rstoenescu added a commit that referenced this issue Oct 17, 2024

fix(app-vite): update to latest Sass specs; supress more warning #17581

06bdd73

rstoenescu added a commit that referenced this issue Oct 17, 2024

fix(app-vite): update to latest Sass specs; supress more warning #17581

3c24bda

rstoenescu added a commit that referenced this issue Oct 17, 2024

fix(app-webpack): upgrade to latest Sass specs; suppress more warnings …

62782cb

…#17581

rstoenescu added a commit that referenced this issue Oct 17, 2024

fix(app-webpack): upgrade to latest Sass specs; suppress more warnings …

0bfcd14

…#17581

rstoenescu closed this as completed Oct 17, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

deprecation warnings in quasar/src/css/variables.sass' #17581

deprecation warnings in quasar/src/css/variables.sass' #17581

Crypto69 commented Oct 17, 2024 •

edited

Loading

github-actions bot commented Oct 17, 2024

Crypto69 commented Oct 17, 2024

Crypto69 commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

zanzara commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

zanzara commented Oct 17, 2024

muhamadamin1992 commented Oct 18, 2024 •

edited

Loading

rstoenescu commented Oct 18, 2024

zanzara commented Oct 18, 2024

LuckDogHu commented Oct 19, 2024

rstoenescu commented Oct 19, 2024

LuckDogHu commented Oct 19, 2024

deprecation warnings in quasar/src/css/variables.sass' #17581

deprecation warnings in quasar/src/css/variables.sass' #17581

Comments

Crypto69 commented Oct 17, 2024 • edited Loading

What happened?

What did you expect to happen?

Reproduction URL

How to reproduce?

Flavour

Areas

Platforms/Browsers

Quasar info output

Relevant log output

Additional context

github-actions bot commented Oct 17, 2024

Crypto69 commented Oct 17, 2024

Crypto69 commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

zanzara commented Oct 17, 2024

rstoenescu commented Oct 17, 2024

zanzara commented Oct 17, 2024

muhamadamin1992 commented Oct 18, 2024 • edited Loading

rstoenescu commented Oct 18, 2024

zanzara commented Oct 18, 2024

LuckDogHu commented Oct 19, 2024

rstoenescu commented Oct 19, 2024

LuckDogHu commented Oct 19, 2024

Crypto69 commented Oct 17, 2024 •

edited

Loading

muhamadamin1992 commented Oct 18, 2024 •

edited

Loading