SCSS Module syntax is not parsed

[S-unya]

The symptom

When are run rollup -c I get a reasonable build, but I get this error if I use the SCSS double slash comment style:

CssSyntaxError: //../packages/core/src/styles/layout.module.scss:56:8: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

As far as I can tell, I have setup the plugin to use sass and to use CSS Modules. When I try to set the parser to "postcss-scss" I get this other error:

[!] (plugin postcss) TypeError: node.getIterator is not a function

rollup.config.js

import url from "@rollup/plugin-url";
import svgr from "@svgr/rollup";
import autoprefixer from "autoprefixer";
import { resolve } from "path";
import postcssNormalize from "postcss-normalize";
import babel from "rollup-plugin-babel";
import peerDepsExternal from "rollup-plugin-peer-deps-external";
import postcss from "rollup-plugin-postcss";
import { nodeResolve } from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "@rollup/plugin-typescript";

import packageJson from "./package.json";

export default [
    {
        input: "src/components/index.ts",
        output: [
            {
                file: `${packageJson.main}`,
                format: "cjs",
                sourcemap: true,
            },
            {
                file: `${packageJson.module}`,
                format: "esm",
                sourcemap: true,
            },
        ],
        plugins: [
            // include peer deps in the package
            peerDepsExternal(),
            // The next 2 allow importing commonjs packages like classnames
            commonjs(),
            nodeResolve(),
            // transform
            babel({
                exclude: "node_modules/**",
            }),
            typescript({
                typescript: require("typescript"),
                tsconfig: "./tsconfig-prod.json",
            }),
            postcss({
                plugins: [autoprefixer(), postcssNormalize()],
                // exclude: "src/styles/**/*.scss",
                namedExports: true,
                sourceMap: true,
                extract: false,
                // modules: true,
                autoModules: true,
                minimize: true,
                extensions: [".scss"],
                use: ["sass"],
                // parser: "postcss-scss",
            }),
            url(),
            svgr(),
        ],
    },
};

There are a couple of commented out options, which I have also tried. I'm not sure where to go from here, so any help would be much appreciated.

In the src/components folders I have this folder strcuture pattern for each component:

components ->
                    >  Button ->
                                      > index.ts
                                      > Button.tsx
                                      > Button.module.scss

[PTiCA1]

I get the same problem CssSyntaxError if I use @rollup/plugin-commonjs.

Does anyone know the solution?