2-4 (webapack4 loader) webpack文件处理(file-loader)之图片处理

一.图片处理
1）安装loader
下载安装file-loader，打开终端，进入到项目文件夹路径，输入命令cnpm install file-loader --save-dev
2）配置webpack.config.js文件
在webpack.config.js文件中的module中的rules里写入

{
   
	test:/\.(png|jpg|gif|jepg)$/,
	use:'file-loader'
},

webpack.config.js全部代码如下所示：

const path = require('path');


module.exports = {
   
	entry:'./public/index.js',
	output:{
   
		path:path.resolve(__dirname,'build'),
		filename:'bundle.js'
	},
	devServer:{
   
		contentBase:'./build',//设置服务器访问的基本目录,就是我们打包完成的目录
		host:'localhost'