[gatsby-plugin-sass] could not override css-loader to use icss mode

[abdhalees]

Preliminary Checks

• [X] This issue is not a duplicate. Before opening a new issue, please search existing issues: https://github.com/gatsbyjs/gatsby/issues
• [X] This issue is not a question, feature request, RFC, or anything other than a bug report directly related to Gatsby. Please post those things in GitHub Discussions: https://github.com/gatsbyjs/gatsby/discussions

Description

after migrating to gatsby v3 and gatsby-plugin-sass v4 which uses v5 of webpack and css-loader I could no longer use :export in my .scss files, it just exports undefined, this change is documented in css-loader and there is an example how to bring the old functionality back: https://github.com/webpack-contrib/css-loader#separating-interoperable-css-only-and-css-module-features

however, when I add these options to gatsby-plugin-sass nothing changes

Reproduction Link

https://codesandbox.io/s/quizzical-butterfly-88o4h?file=/src/components/layout.js:320-366

Steps to Reproduce

1. install gatsby-plugin-sass
2. add to gatsby-config with these options:

   {
      resolve: `gatsby-plugin-sass`,
      options: {
        cssLoaderOptions: {
          importLoaders: 1,
          modules: {
            mode: "icss"
          }
        }
      }
    },
 

3. create a .scss file and use :export to export a variable
4. try importing the above variable from a js/jsx/ts/tsx file

Expected Result

css-loader mode to change to icss variables to be exported from .scss files

Actual Result

css-loader mode does not change

Environment

System:
    OS: macOS 10.15.7
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 14.17.5 - ~/.nvm/versions/node/v14.17.5/bin/node
    npm: 6.14.14 - ~/.nvm/versions/node/v14.17.5/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 92.0.4515.159
    Firefox: 78.10.1
    Safari: 14.1.2
  npmPackages:
    gatsby: ^3.12.0 => 3.12.1
    gatsby-plugin-csp: ^1.1.3 => 1.1.3
    gatsby-plugin-exclude: ^1.0.2 => 1.0.2
    gatsby-plugin-image: ^1.12.0 => 1.12.0
    gatsby-plugin-layout: ^2.12.0 => 2.12.0
    gatsby-plugin-meta-redirect: ^1.1.1 => 1.1.1
    gatsby-plugin-postcss: ^4.12.0 => 4.12.0
    gatsby-plugin-react-helmet: ^4.12.0 => 4.12.0
    gatsby-plugin-sass: ^4.12.0 => 4.12.0
    gatsby-source-contentful: ^5.12.0 => 5.12.0
    gatsby-plugin-schema-snapshot: ^2.12.0 => 2.12.0
    gatsby-plugin-webpack-bundle-analyser-v2: ^1.1.24 => 1.1.24
    gatsby-source-filesystem: ^3.12.0 => 3.12.0

Config Flags

No response