@Jun1801

Почему WebPack 4 + React не импортируется *.css?

Без вебпака все работало, импортировал вот так:

import "./components/Modal/index.css";
import "./common/styles/index.css";
import 'bootstrap/dist/css/bootstrap.css';


Когда начал собирать с вебпаком, css больше не подключается в проект
webpack.config.js
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
var path = require('path');

module.exports = {
    entry: "./src/index.js",
    output: {
        path: path.resolve(__dirname, 'build'),
        publicPath: 'build',
        filename: "bundle.js"
    },
    module: {
        rules: [
            {
                test: /\.js?$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
                query: {
                    presets: ['react', 'es2015', 'stage-0']
                }
            },
            {
                test: /\.htm?$/,
                use: [
                    {
                        loader: "html-loader",
                        options: {minimize: true}
                    }
                ]
            },
            {
                test: /\.css$/,
                use: [MiniCssExtractPlugin.loader, "css-loader"]
            },
            {
                test: /\.less$/,
                use: [{
                    loader: 'style-loader'
                }, {
                    loader: 'css-loader'
                }, {
                    loader: 'less-loader'
                }]
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: "[name].css",
            chunkFilename: "[id].css"
        })
    ]
}
index.html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>404 - Не найдено</title>
    <link rel="stylesheet" type="text/css" href="src/common/styles/reset.css" />
</head>
<body>
<div id="root"></div>
<script src="build/bundle.js"></script>
</body>
</html>
Как подключить .css файлы или собрать их в единый bundle.css?
  • Вопрос задан
  • 126 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы