take this from my webpack.config file:

  {
    test: /\.scss$/,
    use: [
      {
        loader: "sass-loader",
        options:{
          implementation: require('sass')
        }
      }
    ],
  }, 

I'm also explicitly declaring the implementation (usually not needed). What I get is this:

ERROR in ../scss/front-page.scss 1:0
Module parse failed: Unexpected token (1:0)
File was processed with these loaders:
 * ./node_modules/sass-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
> :root {
|   --border-radius: 7px;
| }

It seems it doesn't recognize css custom props.

Using

"sass": "^1.49.7",
"sass-loader": "^12.6.0",

Any idea?