How to enable sass modules in webpack 4?

1

npm install sass sass-loader style-loader css-loader --save-dev

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

module.exports = {
  // ...
  module: {
    rules: [
      // ...
      {
        test: /.module.scss$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              modules: true // Enable CSS modules
            }
          },
          'sass-loader'
        ]
      },
      // ...
    ]
  },
  
  // ...
};

1
2
3
4

import styles from './styles.module.scss';

// Use the styles object to access your styled classes
console.log(styles.exampleClass);