Add sass loader to the webpack already using react - reactjs

Question

I have this configuration in my webpack and I need to add sass-loader,
I already added the dependencies using
npm install sass-loader sass webpack --save-dev
But I'm confused where I include the sass loader and the documentation settings.
Now how to add to my webpack?
'use strict'
const path = require('path')
const webpack = require('webpack')
const validate = require('webpack-validator')
module.exports = validate({
devtool: 'source-map',
entry: [
'react-hot-loader/patch',
'webpack-dev-server/client?http://localhost:3000',
'webpack/hot/only-dev-server',
path.join(__dirname, 'src', 'index'),
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/dist/'
},
plugins: [
new webpack.HotModuleReplacementPlugin()
],
module: {
preLoaders: [{
test: /\.js$/,
exclude: /node_modules/,
include: /src/,
loader: 'standard'
}],
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
include: /src/,
loader: 'babel'
}],
}
})

Answer 1

I assume you want to add sass-loader in order to support scss files.
Add a new item to the loaders/rules array:
If you use webpack < v3:
loaders:[
...,
{
test: /\.(scss|sass)$/,
loader: 'style-loader!css-loader!sass-loader'
}
]
For webpack > v3 add a rule like this:
rules:[
...,
{
test: /\.(scss|sass)$/,
use: [
'style-loader',
'css-loader',
'sass-loader',
],
}
]
For more details look here https://webpack.js.org/loaders/sass-loader/