webpack 中使用图片

1. config中需要用file-loader支持文件处理

 module: {
		rules: [
                        ...
			{
				test: /\.(png|svg|jpg|ico|gif|bmp|pdf|jpe?g)$/,
				use: [
					//'file-loader'
				
					{
						loader:'file-loader',
						options:{
							name:'[name].[ext]',
							outputPath:'img2/'
							//publicPath:'img/'
						}
					}
				
				]
			},
			...
		]
	},

2. css中使用图片

   直接调用本地路径，如：background-image: url(../../src/img/bg_ad_33.jpg);

 

3. js[x]代码中使用图片

   使用require，如：<img src={require("../src/img/arrow_down.png")} />

 

转载于:https://www.cnblogs.com/dongfangchun/p/9323643.html