SassError: "This variable was not declared with !default in the @used module"

[SachaG]

Using pico v2.0.3 in a Next.js project via the npm package (and using pnpm), the regular version works fine but trying to use @use with the yellow theme gives me this error:

This variable was not declared with !default in the @used module

[SachaG]

Seems similar to sass/dart-sass#2063

[SachaG]

Oh, I noticed that although @use "pico"; works, it's loading the previous version of Pico (pre-2.0). So maybe that's the root of the issue? If that variable doesn't exist in previous versions that might explain the error. But then how can I make it load the right version…?

Note: on the other hand @import "@picocss/pico/scss/pico"; does load v2…

[glaplace]

Hello,

I have same error (vuejs 3 + vitejs).

To solve it i use

@use "@picocss/pico/scss/pico" with (
  $theme-color: "grey"
);

It works but i have the same question as @SachaG .

Won't this be a problem in the future ?

Thanks.