new output option - output as string

[mattconde]

I've been trying to use this in combination with file-loader, so I can chain converting from SASS and processing all my files used in my SASS to then output a CSS file that references those files.

eg.

    loaders: [
        {
            test: /\.scss$/,
            loaders: [
                'file-loader?name=[name].css',
                'css-loader?outputStyle=default | string',
                'autoprefixer-loader?{browsers:["last 2 version", "Firefox 15"]}',
                'sass-loader?outputStyle=compressed'
            ]
        },
        {
            test: /\.png$|\.jpg$|\.gif$|\.ico/,
            loader: 'file-loader?name=assets/[hash:7]-[name].[ext]'
        },
        {
            test: /\.eot$|\.woff$|\.ttf$|\.svg$/,
            loader: 'file-loader?name=assets/[hash:7]-[name].[ext]'
        }
    ]

?outputStyle=string will allow us to create a files easily and still manage all our CSS dependencies with the mighty css-loader.

[mattconde]

After using Webpack more ExtractTextPlugin exactly what should be used here. Although request may help cut down a tiny bit of very few peoples config.

For other people thinking my initial idea would be useful, explore ExtractTextPlugin first. It's proved to be exactly what I needed.

Example of what I've got working well on a soon to be production site.

var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
    ...
    module: {
        loaders: [
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract(
                    'css-loader?sourceMap!' +
                    'autoprefixer-loader?{browsers:["last 2 version", "Firefox 15"]}!' +
                    'sass-loader?outputStyle=compressed&sourceMap=true&sourceMapContents=true'
                )
            },
            {
                test: /\.png$|\.jpg$|\.gif$|\.ico/,
                loader: 'file-loader?name=assets/[name]-[hash:7].[ext]'
            },
            {
                test: /\.eot$|\.woff$|\.ttf$|\.svg$/,
                loader: 'file-loader?name=assets/[name]-[hash:7].[ext]'
            }
        ]
    },
    resolve: {
        extensions: ['', '.js', '.json'],
        modulesDirectories: ['node_modules']
    },
    devtool: 'source-map',
    plugins: [
        new ExtractTextPlugin('[name].css')
    ]
    ...
};