javascript - 将未压缩的 scss 或 css 导入 js 文件时出现空样式标签

Question

<style>当我导入 uncompress 时，我的 HTML 为空，scss或者csscss 被压缩，它可以注入<style>当前

有没有人可以帮我弄清楚我的 webpack 配置有什么问题？

非常感谢！！

在我的 Js 文件中

import './somescss.scss'

webpack 配置文件中的模块

    module: {rules: [
        {
            test: /\.css$/i,
            use: ['style-loader', 'css-loader'],
        },
        {//js loader},
        {
            test: /\.scss$/,
            use: [{
                    loader: MiniCssExtractPlugin.loader,
                    options: {
                        hmr: process.env.NODE_ENV === 'development',
                        reloadAll: true,
                    },
                },
                {
                    loader: 'css-loader',
                },
                {
                    loader: 'sass-loader',
                    options: {outputStyle: 'compressed'},
                }
]}]}

标签： javascriptwebpack

Answer 1

下面的配置对我有用

module: {
        rules: [{
                test: /\.scss$/,
                use: [
                    'style-loader',
                    MiniCssExtractPlugin.loader,
                    {
                        loader: "css-loader",
                        options: {
                            minimize: true,
                            sourceMap: true
                        }
                    },
                    {
                        loader: "sass-loader"
                    }
                ]
            }
        ]
    }