Wenn das Webpack das Bild packt, wird festgestellt, dass der Wert des Quellcodes des Bildes dem Wert von [Objekt Moudle] entspricht.

xxx.htmlBeim Verpacken imgmuss es verarbeitet werden html-loader. Wenn es nicht verwendet wird, wird xxx.htmles imgnicht verpackt. Die Rolle dieses Laders besteht darin, img zu importieren, damit es url-loaderverarbeitet werden kann

---

Problem: html-loaderDer Import von Bildern ist abgeschlossen commonjs解析(node的)und url-loaderdie Standardeinstellung ist die modulare ES6-Analyse, was zu Fehlern führt

---

lösen:

Es muss im Loader für die Bildverarbeitung verarbeitet werden

rules:[
{
    
    
test:/\.(png|jpg|gih)$/,
loader:'url-loader',
options:{
    
    
	limit:8*1024,//图片小于8kb，就会被以base64格式处理
	esModule:false,//关闭url-loader的es6解析模式，使用commonjs去解析
	name:'[hash:10].[ext]',//取hash值前10位，ext：取源文件的扩展名
}
},
{
    
    
text:/\.html$/,

loader:'html-loader'//处理html文件的img图片（负责引入img,从而能够被url-loader进行处理）
}
]