Answer the question
In order to leave comments, you need to log in
How to change MiniCssExtractPlugin plugin output directory for Webpack?
I have the following webpack config:
const path = require('path')
const HTMLPlugin = require('html-webpack-plugin')
const BrowserSyncPlugin = require('browser-sync-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports = {
entry: './app/index.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
module: {
rules: [
{
test: /\.pug$/,
loader: 'pug-loader',
options: {
pretty: true
}
},
{
test: /\.s[ac]ss$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
},
]
},
plugins: [
new HTMLPlugin({
filename: 'index.html',
template: './app/index.pug'
}),
new BrowserSyncPlugin({
host: 'localhost',
port: 3000,
server: { baseDir: ['dist'] }
}),
new MiniCssExtractPlugin({
filename: 'style.css',
}),
]
};
Answer the question
In order to leave comments, you need to log in
new MiniCssExtractPlugin({
filename: "styles/[name].css",
chunkFilename: "styles/[id].css",
}),
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question