styles is undefined in module.scss

[Faraz1995]

Bug report

Styles import from a module scss file is undefined

Actual Behavior

when i use a.module.scss and import it import styles from './a.module.scss'
styles is always undefined

Expected Behavior

in "css-loader": "^6.8.1", it works just fine but in lts version i mean "css-loader": "^7.1.2",my styles object are undefined

How Do We Reproduce?

here is my webpack config

    config.module.rules.push({
      // scss loader
      test: /\.scss$/,
      use: [
        'style-loader',
        {
          loader: 'css-loader',
          options: {
            modules: {
              localIdentName: '[name]__[local]--[hash:base64:5]'
            }
          }
        },
        {
          loader: 'sass-loader'
        }
      ]
    }, {
      // css loader
      test: /\.css$/,
      use: ['style-loader', 'css-loader']
    })

and i am using css loader 7.1.2 , nextjs 14.2.5

Please paste the results of npx webpack-cli info here, and mention other relevant information

  System:
    OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 Intel(R) Core(TM) i7-10870H CPU @ 2.20GHz
    Memory: 6.50 GB / 15.45 GB
  Binaries:
    Node: 20.12.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.5.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 126.0.6478.182
  Packages:
    css-loader: ^7.1.2 => 7.1.2 
    sass-loader: ^16.0.0 => 16.0.0 
    style-loader: ^4.0.0 => 4.0.0

[evenstensberg]

@Faraz1995 could you create a reproduction repository? Also, you need to format the code in the issue better for us to fix this

[Faraz1995]

i reformat the code, tnx for mention it, also i try to make a sandbox for it too

[Faraz1995]

@evenstensberg
https://stackblitz.com/edit/stackblitz-starters-ucqnqy
here is sandbox for reproduce my exact problem

[evenstensberg]

GitHub repo is better

[Faraz1995]

https://github.com/Faraz1995/css-loader-issue
here is github for this issue @evenstensberg

[angle222]

Bug report

Styles import from a module scss file is undefined

Actual Behavior

when i use a.module.scss and import it import styles from './a.module.scss' styles is always undefined

Expected Behavior

in "css-loader": "^6.8.1", it works just fine but in lts version i mean "css-loader": "^7.1.2",my styles object are undefined

How Do We Reproduce?

here is my webpack config

    config.module.rules.push({
      // scss loader
      test: /\.scss$/,
      use: [
        'style-loader',
        {
          loader: 'css-loader',
          options: {
            modules: {
              localIdentName: '[name]__[local]--[hash:base64:5]'
            }
          }
        },
        {
          loader: 'sass-loader'
        }
      ]
    }, {
      // css loader
      test: /\.css$/,
      use: ['style-loader', 'css-loader']
    })

and i am using css loader 7.1.2 , nextjs 14.2.5

Please paste the results of npx webpack-cli info here, and mention other relevant information

  System:
    OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 Intel(R) Core(TM) i7-10870H CPU @ 2.20GHz
    Memory: 6.50 GB / 15.45 GB
  Binaries:
    Node: 20.12.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.5.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 126.0.6478.182
  Packages:
    css-loader: ^7.1.2 => 7.1.2 
    sass-loader: ^16.0.0 => 16.0.0 
    style-loader: ^4.0.0 => 4.0.0

I also encountered the same problem，using 6.x is ok

[alexander-akait]

Please use import * as styles from "./page.module.css";, please read changelog before migration - https://github.com/webpack-contrib/css-loader/releases/tag/v7.0.0

[Faraz1995]

@alexander-akait as you can see in my sandbox, by your way, styles were not applied

[alexander-akait]

@Faraz1995 Your sandbox works fine, all styles were applied, even more you don't have css-loader at all in your repo