Невозможно применить стили к React с использованием загрузчиков

Question

В моем webpack.config.js я добавил "style-loader" и "css-loader", как рекомендовано.Я также импортировал стили из "./style.css"(import styles from" ./style.css ") в свой корневой компонент.Но это не применяет стили к моему приложению.Что я делаю неправильно?Что мне не хватает?У меня "Модуль не найден: ошибка: не удается разрешить файл или каталог"

  ...
 output: {
   path: __dirname + './static',
   filename: 'app.bundle.js'
 }, 
 {
   test:/\.css$/,
   use: [
      "style-loader",
      "css-loader",
     ]
 }
  ...

Answer 1

Вы должны изменить на loader что-то вроде этого

module: {
        rules: [{
                test: /\.scss$/,
                use: [
                    'style-loader',
                    MiniCssExtractPlugin.loader,
                    {
                        loader: "css-loader",
                        options: {
                            minimize: true,
                            sourceMap: true
                        }
                    },
                    {
                        loader: "sass-loader"
                    }
                ]
            },
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules/,
                loader: ["babel-loader", "eslint-loader"]
            },
            {
                test: /\.(jpe?g|png|gif)$/i,
                loader: "file-loader"
            },
            {
                test: /\.(woff|ttf|otf|eot|woff2|svg)$/i,
                loader: "file-loader"
            }
        ]
    }

Answer 2

Похоже, ваш output.path не так. У меня так работает.

РЕДАКТИРОВАТЬ: также, загрузчики идут внутри модулей. Rules

const path = require('path');
.
.
.    

output: {
   path: path.join(__dirname, 'static/')
   filename: 'app.bundle.js'
 },
 module: {
  rules:[
 {
   test:/\.css$/,
   use: [
      "style-loader",
      "css-loader",
     ]
 }
]}