---

我用的是webpack的V5.75.0版本，下面是正确的配置方法

module.exports = {
	...
	// 所有第三方文件模块的匹配规则
	module: {
		rules: [
			{
				test: /\.jpg|png|gif|bmp|ttf|eot|svg|woff|woff2$/,
				use: {
					loader: "url-loader",
					options: {
						limit: 16940,
						esModule: false
					}
				},
				type: "javascript/auto"
			}
		]
	}
};

下面是我的debug过程
原始的配置webpack.config.js配置

module.exports = {
	...
	// 所有第三方文件模块的匹配规则
	module: {
		rules: [
			{
				test: /\.jpg|png|gif|bmp|ttf|eot|svg|woff|woff2$/,
				use: "url-loader?limit=16940"
			}
		]
	}
};

可以正常编译
但是网页不能正常显示，可以看到加载的是打不开的图
然后通过查询官方文档找到问题描述

还是不行，然后继续找文档，发现我当前版本默认使用esModule语法

因此，再关闭esModule属性就可以了，配置文件如下

module.exports = {
	...
	// 所有第三方文件模块的匹配规则
	module: {
		rules: [
			{
				test: /\.jpg|png|gif|bmp|ttf|eot|svg|woff|woff2$/,
				use: {
					loader: "url-loader",
					options: {
						limit: 16940,
						esModule: false
					}
				},
				type: "javascript/auto"
			}
		]
	}
};

参考

1. webpack打包图片多生成空白图片且图片不能正常加载

写在最后

如果你感觉文章不咋地//(ㄒoㄒ)//，就在评论处留言，作者继续改进；o_O???
如果你觉得该文章有一点点用处，可以给作者点个赞；\\*^o^*//
如果你想要和作者一起进步，可以微信扫描二维码，关注前端老L；~~~///(^v^)\\\~~~
谢谢各位读者们啦(^_^)∠※！！！