How to add sass to webpack + react?

Question

JavaScript

Good afternoon!
How to properly add sass to webpack + react config?

var path = require('path');

var BUILD_DIR = path.resolve(__dirname, './');
var APP_DIR = path.resolve(__dirname, 'src/');

var config = {
    entry: APP_DIR + '/index.jsx',
    output: {
        path: BUILD_DIR,
        filename: 'bundle.js'
    },
    devServer: {
        contentBase: BUILD_DIR
    },
    module: {
        loaders: [
            {
                test: /\.jsx?/,
                include: APP_DIR,
                loader: 'babel-loader'
            }
        ]
    }
};

module.exports = config;

It is desirable that you can connect like this: import './style.sass'
git
Error:

ERROR in ./src/index.jsx
Module parse failed: C:\Users\steko\Desktop\TEST\m-react\src\index.jsx Unexpected token (9:8)
You may need an appropriate loader to handle this file type.
| render() {
| return (
|
| Hello React Project!!!
|

Answer 1

Use sass-loader . The repository has installation instructions. If you want to use CSS modules, read the instructions for css-loader