Добрый день! Подскажите пожалуйста как поправить
webpack config так чтобы он компилировал все *.scss в один отдельный файл *.css файл?
Сейчас он компилирует для каждого sass файла отдельный blob. Не понимаю почему так, делаю все как в
документации плюс перепробовал различные статьи.
Что еще надо добавить чтоб ето работало? Мне нужно в результате один css файл.
Буду очень благодарен за какую-то помощь.
prod config
module.exports = merge(require('./webpack.base.config'), {
module: {
rules: [{
test: /\.scss$/,
use: [
// fallback to style-loader in development
process.env.NODE_ENV !== 'production' ? 'style-loader' : MiniCssExtractPlugin.loader,
"css-loader",
"sass-loader"
]
}]
},
plugins: [
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// both options are optional
filename: "[name].css",
chunkFilename: "[id].css"
})
],
});
webpack.base.config
module.exports = {
context: resolve(__dirname, '../'),
output: {
filename: 'bundle.js',
path: resolve(__dirname, '../build'),
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /\.(png|jpe?g|gif|svg|eot|ttf|woff|woff2)$/,
loader: 'url-loader',
options: {
limit: 8192,
},
},
{
test: /\.html$/,
use: 'raw-loader',
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: "src/index.html",
}),
]
};
