Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

285
Views
Webpack 5: Compile multiple SCSS files to one CSS file

I would like to export several SCSS files, which I import into my entry file, into a CSS file. So far I have only included an SCSS file and converted it without a plugin.

module.exports = {
    ...
    module: {
        rules: [
            {
                test: /\.s[ac]ss$/i,
                use: [
                    {
                        loader: 'file-loader',
                        options: {outputPath: '/', name: '[name].css'}
                    },
                    {
                        loader: 'sass-loader',
                        options: {
                            sassOptions: {
                                importer: globImporter()
                            }
                        }
                    }
                ]
            }
        ]
    },
    ...
}

Dist-Folder: frontend.js, frontend.css

However, when I import multiple files, they are also exported as individual CSS files:

import './assets/scss/frontend.scss';
import './node_modules/swiper/swiper.scss';

Dist-Folder: frontend.js, frontend.css, swiper.css

Is there a way to merge both SCSS files into one frontend.css file?

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!