Clever Geek Handbook

Ouput css, not inline

How to output the css file as file.css and not inline in javascript. My config looks like below.

 {
                test: /\.less$/,
                loader: "style-loader!css-loader!less-loader" 
 }

I tested "file-loader! Css-loader! Less-loader" // but file content is not css

+3


source to share


1 answer


You will need to use extract-text-plugin . You can create one css file for the whole package, or one for each chunk. For example, if you wanted all your CSS in your bundle to move to a separate file, you would add that to your config

module.exports = {
    loaders: [
            // Extract css files
            {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader")
            },
            // Optionally extract less files
            // or any other compile-to-css language
            {
                test: /\.less$/,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader!less-loader")
            }
        ],
    plugins: [
        new ExtractTextPlugin("[name].css", {
            allChunks: true
        })
    ]
}


For details, see the web page settings table for more reference

+8


source






More articles:


All Articles