Search code examples
reactjssassnode-sass

I can't use @use in sass file in Create React App + node-sass setup

In my src/styles/variables.scss file, I have $primary-color: #171b42; defined.

I want to use this variable in my src/components/LandingPage/LandingPage.module.scss file.

Inside this file, I have:

@use "../../styles/variables.scss" as v;

$color: v.$primary-color;

.heading {
  color: $color;
}

I get this error:

SassError: Invalid CSS after "$color: v": expected expression (e.g. 1px, bold), was ".$primary-color;"

What am i doing wrong? I have node-sass installed

Solution

  • I just ran into the same issue. If you pay close attention to the Sass documentation, it says (as of 5/16/2020):

    Only Dart Sass currently supports @use. Users of other implementations must use the @import rule instead.