4、webpack提取css成单独文件

将css单独打包成文件

得用插件 npm i mini-css-extract-plugin -D

const MiniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports = {
	entry: "",
	output: {},
	module: {
		rules: [
			{
				test: /\.css$/,
				use: [
					// 这里原来是一个'style-loader'；用插件替代它，作用就是：提取js中的css成单独文件（为啥是js中的呢，看下边那个css-loader）
					MiniCssExtractPlugin.loader,
					// 将css文件变成commonjs模块加在js中，里面内容是样式字符串。为啥要变css文件呢，还是那个问题，webpack只认识js和json
					'css-loader',
				]
			},
		]
	},
	plugins:{
		new MiniCssExtractPlugin({
			// 对打包输出的css文件重新设置
			filename: 'css/***.css'
		})
	},
	mode:""
}