webapck中css文件单独打包

mini-css-extract-plugin

该插件的功能是将一个css提取为一个独立的样式文件，这和style-loader（将文件放到html的head中）的作用是互斥的，两者不能一起使用。

cnpm i mini-css-extract-plugin -D

替代style-loader

 {
     test:/.css$/,
     use:[
              MiniCssExtractPlugin.loader, 
              'css-loader'
      ]
}

添加插件

 plugins:[
        new MiniCssExtractPlugin({
            filename:'[name]_[contenthash:8].css'
        })
    ]