title: Trying to use sass modules in create-react-app with the new @use syntax but receiving an error
body: <p>I've npm installed the latest node-sass, and scss files work fine until I use @use. I have a _tokens.scss file in /shared/tokens/ folder. Within _tokens.scss I have:</p>
  
  <pre><code>$colorwhite: #ffffff;
  </code></pre>
  
  <p>In my root folder, my App.scss looks like this:</p>
  
  <pre><code>@use "shared/tokens/tokens";
  
  .App-header {
    color: tokens.$colorwhite;
  }
  </code></pre>
  
  <p>But I am getting this error:</p>
  
  <pre><code>./src/App.scss (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--6-oneOf-5-3!./node_modules/sass-loader/dist/cjs.js??ref--6-oneOf-5-4!./src/App.scss)
  SassError: Invalid CSS after "  color: tokens": expected expression (e.g. 1px, bold), was ".$colorwhite;"
          on line 26 of /Users/xxx/src/App.scss
  &gt;&gt;   color: tokens.$colorwhite;
  </code></pre>
  
  <p>Any ideas?</p>
  
  <p>Edit: it works fine with <code>@import</code>. I've also tried <code>@use... as *</code> but no-go.</p>