有没有办法用 webpack 4 将 scss 文件构建到 css

Question

我正在试用 Webpack 4，我想知道它是否有内置的方式来管理 Scss 文件，因为 ExtractTextPlugin 不起作用。

Answer 1

在 Webpack 4 中，您还需要使用 extract-text-webpack-plugin 才能从包中提取文本。问题是稳定版与新的插件系统不兼容。团队正在努力，但与此同时您需要安装 v4.0.0-beta.0 版本。

yarn add extract-text-webpack-plugin@next --dev

您还可以在 GitHub 上使用更多配置检查此 webpack-demo。

在webpack.config.js脚本上的使用保持不变：

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

module.exports = {
    // ...
    module: {
        rules: [
            {
                test: /.scss$/,
                use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: [
                        {
                            loader: 'css-loader',
                            options: {
                                modules: true,
                                camelCase: 'dashes',
                                minimize: true
                            }
                        },
                        {
                            loader: 'sass-loader'
                        }
                    ]
                })
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin('[name].[chunkhash].css')
    ]
}

有没有办法用 webpack 4 将 scss 文件构建到 css

Is there a way to build scss files into css with webpack 4

javascript

sass

webpack-4