Нужно использовать
extractTextPlugin
Кусочек конфига:
для webpack 2:
module.exports = {
devtool: 'cheap-module-source-map',
entry: [
'./src/index'
],
output: {
path: path.join(__dirname, 'production/public/'),
filename: 'bundle.js',
publicPath: '/',
},
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
}),
new ExtractTextPlugin({
filename: 'style.css',
disable: false,
allChunks: false, // true
})
],
module: {
rules: [
{
test: /\.js$/,
loaders: ['babel-loader'],
include: path.join(__dirname, 'src'),
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
fallbackLoader: 'style-loader',
loader: ['css-loader', 'postcss-loader'],
publicPath: '/public',
}),
}, {
test: /\.scss$/,
loader: ExtractTextPlugin.extract({
fallbackLoader: 'style-loader',
loader: ['css-loader', 'postcss-loader', 'sass-loader'],
publicPath: '/public',
}),
},
....
Для webpack 1:
module.exports = {
devtool: 'cheap-module-source-map',
entry: [
'./src/index'
],
output: {
path: path.join(__dirname, 'production/public/'),
filename: 'bundle.js',
publicPath: '/',
},
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
}),
new ExtractTextPlugin('style.css', {
allChunks: false
})
],
module: {
loaders: [
{
test: /\.js$/,
loaders: ['babel'],
include: path.join(__dirname, 'src')
},
{
test: /\.scss$/,
include: path.join(__dirname, 'src'),
loader: ExtractTextPlugin.extract('style-loader', 'css-loader!postcss-loader!sass-loader')
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract('style-loader', 'css-loader')
},
...
Само собой, нужно не забыть добавить ExtractTextPlugin
const ExtractTextPlugin = require('extract-text-webpack-plugin');
