sass - Webpack ExtractTextPlugin 蓝调

Question

我似乎无法让 ExtractTextPlugin 正常工作。我从未见过 CSS 文件。在我尝试切换到这个插件之前，scss 文件被捆绑在一起没有问题。

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

module.exports = {
    entry: "./index.js",
    output: {
        path: "dist/",
        filename: "bundle.min.js",
        publicPath: "/",
        sourceMapFilename: 'bundle.min.map'
    },
    devtool: '#source-map',
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: /(node_modules)/,
                loader: ['babel'],
                query: {
                    presets: ['es2015', 'stage-0', 'react']
                }
            },
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract("style", "css", "sass")
            },
            {
                test: /\.(png|jpg|jpeg|gif|woff|woff2|svg)$/,
                loader: 'url-loader?limit=8192'
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin("bundle.css")
    ],
    sassLoader: {
        includePaths: [path.resolve(__dirname, './stylesheets')]
    }
 };

SCSS 文件使 bundle.min.js 文件没有问题...

        {
            test: /\.scss$/,
            loader: ['style', 'css?sourceMap', 'sass?sourceMap']
        }

但我需要将 CSS 文本包含在服务器呈现的响应中。

Answer 1

而不是ExtractTextPlugin.extract("style", "css", "sass")你会想要使用ExtractTextPlugin.extract("style", "css!sass"). 这个 API 有点奇怪。