sass icon indicating copy to clipboard operation
sass copied to clipboard

@use doesn't work correctly with Vite aliases

Open Psychosynthesis opened this issue 11 months ago • 9 comments

The problem is that @import for importing variables in sass is now deprecated, so as stated in the official documentation, I need to use the @use statement instead:

@use '../path/to/colors';
// instead of
@import '../path/to/colors';

Okay, it's work correctly. But, if i use the aliases as below:

@use '@Commn/colors';

It's doesn't work. I don't know is the problem with Vite, or with Sass actually. I found only one partial solution:

@use '@Commn/colors' as *;

This solves my problem, although a message appears stating that this import format will soon be deprecated:

Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
More info: https://sass-lang.com/d/legacy-js-api

I saw in chats that many people have these problems, but couldn't find a solution.

Maybe someone will suggest a normal solution (without disabling warnings). Well, or at least I will highlight this problem for the developers.

Psychosynthesis avatar Nov 09 '24 17:11 Psychosynthesis