网页包-如何确定CSS文件的输出样式？

当使用Gulp将Sass转换为CSS时，我可以选择CSS文件的输出样式：嵌套、扩展、压缩和压缩。我是否有同样的机会使用Webpack？如果是，你能告诉我如何配置网页来实现我的目标吗

下面是我当前的webpack.config.js-它将sass转换为css，将ES6转换为ES5，并且工作非常完美：

const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    entry: [
        "./js/app.js",
        "./scss/main.scss"
    ],
    output: {
        filename: "./js/out.js"
    },
    watch: true,
    module: {
        loaders: [
            {
                test: /.js$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                query: {
                    presets: ["es2015"]
                }
            }
        ],
        rules: [
            {
                test: /.scss$/,
                use: ExtractTextPlugin.extract({
                    fallbackLoader: "style-loader",
                    use: ["css-loader?-url", "sass-loader?-url"]
                })
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin({
            filename: "./css/main.css",
            disable: false,
            allChunks: true
        })
    ]
}

---

提前谢谢

您正在使用

sass加载程序

，它在引擎盖下使用

节点sass

。说明可以通过指定

options

属性将选项直接传递给

节点sass

。您可以通过这种方式传入

outputStyle

设置。它看起来是这样的：

{
    test: /.scss$/,
    use: ExtractTextPlugin.extract({
        fallbackLoader: "style-loader",
        use: [{
            loader: 'css-loader'
        }, {
            loader: 'sass-loader',
            options: {
                outputStyle: 'expanded'
            }
        }]
    })
}

@阿内尔·巴兰

---

该勾选解决方案无法与升级的webpack和sass loader一起使用

这是最新的工作模式，使用：

• “网页包”：“^4.44.1”
• “sass加载程序”：“~9.0.3”

{
测试：/.scss$/,，
用法：ExtractTextPlugin.extract({
回退加载器：“样式加载器”，
使用：[
{
加载器：“css加载器”
}, 
{
加载器：“sass加载器”，
选项：{
sassOptions：{
outputStyle:“扩展”
}
}
}
]
})
}

勾选的解决方案无法与升级的webpack和sass loader一起使用。我为那些可能也在更新中挣扎的人添加了一个答案