我正在使用样式加载器，css-loader，sass-loader和Webpack来为每个反应组件设置样式，方法是为每个组件导入每个.scss文件 . 所有样式都转到bundle.js . 我想对组件内容使用转换和动画，但css-transitions-group似乎不起作用 . 它只有在我将样式放入css文件并将其绑定到index.html时才有效 .

那么如何从装载机中提取所有捆绑的样式呢？ bundle.css . 我试图使用extract-text-webpack-plugin，但无法正确配置它 .

const webpack = require('webpack');

module.exports = {

    module:{

        rules: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                use: {
                    loader: "babel-loader",
                    options: { presets: ["es2015", "stage-2", "react"] }
                }
            },
            {
                test: /\.scss$/,
                use: [
                    {
                        loader: "style-loader"
                    },
                    {
                        loader: "css-loader",
                        options: {
                            modules:true,
                            localIdentName: "[local]_[hash]"
                        }
                    },
                    {
                        loader: "sass-loader"
                    }
                ]
            },
            {
                test: /\.(jpg|png)$/,
                use: ["file-loader"]
            }
        ]

    },
    resolve:{
        extensions: ["*", ".js", ".jsx"]
    },
    entry: "./src/index.js",
    mode: "development",
    output: {
        path: __dirname + "/docs",
        filename: "bundle.js"
    },
    devServer: {
        contentBase: "./docs"
    }
}
javascript css reactjs webpack sass-loader