webpack单独打包css报错

问题描述

问 题

以下是我的 webpack 配置

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

module.exports = {
    entry: {
        index: [
            './dev/js/index.js'
        ]
    },
    output: {
        filename: './dist/js/[name].js'
    },
    devtool: 'source-map',
    module: {
        loaders:[
            { test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }
        ]
    },
    plugins: [
        new ExtractTextPlugin("styles.css")
    ]
};

下面是目录结构

报错信息

代码百度了很多个版本的，没有一个能用的，求大神指点！

解决方案

module:{
    rules:[{
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
            use: 'css-loader',
            fallback: 'style-loader'
        })
    }]
}

这篇关于webpack单独打包css报错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！