How to use 2 CSS files in Webpack

Question

I'm new to Webpack and have installed "webpack": "^3.5.5" package. Here is my webpack.config.js.

module: {
        rules: [
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.js$/, exclude: /node_modules/, loader: "babel-loader"
            }
        ]
    }

It works fine for one CSS file, but i would like to load 2 CSS files. 1- Bootstrap 2- style.css

I tried some configuration that i found on Github, but it didn't help. How can i do that?

Answer 1

Loading of the css file is done via importing them from a js file. So if you want to use the file 'style.css', import it from a js file like:

import './style.css';

Then webpack will use the css loader to bring in your styles.