@ch-aqwer

Как сделать чтобы вебпак компилировал все scss-файлы в один css-файл?

Добрый день! Подскажите пожалуйста как поправить 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",
        }),
    ]
};
  • Вопрос задан
  • 193 просмотра
Пригласить эксперта
Ответы на вопрос 1
@andreysuha
Что то знаю
Импортие все scss в один scss, потом в entry point js импортите этот scss
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы