Why don't postcss-loader and bootstrap work together?

Question

JavaScript

Hey! I know this is a very stupid question, but I still don't understand why.
Decided to connect Bootstrap via npm

import 'bootstrap';
import 'bootstrap/dist/css/bootstrap.min.css';

But when I go to the site, I get this:

Snippet from webpack

{ // css
      test: /\.css$/,
      use: [
        MiniCssExtractPlugin.loader,
        { // css-loader
          loader: `css-loader`,
          options: {
            sourceMap: true,
            url: false
          }
        },
        {
          loader: `postcss-loader`,
          options: {
            ident: `postcss`,
            sourceMap: true,
            plugins: () => [
              require(`autoprefixer`),
              require(`css-mqpacker`),
              require(`cssnano`)({
                preset: [
                  `default`, {
                    discardComments: {
                      removeAll: true,
                    }
                  }
                ]
              })
            ]
          }
        },
        `csscomb-loader`
      ]
    }

Maybe someone knows what the problem is and how to solve it? If you need more files, please ask.

Answer 1

I usually connect the autoprefixer like this:

npm install postcss-loader --save-dev
npm i -D autoprefixer

In webpack.config.js:

{
        test: /\.scss$/,
        use:  [  'style-loader', 'css-loader', 'postcss-loader', 'sass-loader']
 }

Then in postcss.config.js:

module.exports = {
    plugins: [
      require('autoprefixer')
    ]
}