在使用url-loader对图片文件进行打包的时候,出现了如下的错误:
问题原因:webpack.config.js中设置的limit大小小于打包的图片的大小~。如果打包图片大小在limit限制的值以内可用正常打包,如果是大于了这个值,webpack则会使用file-loader来进行打包。这里因为超过了,所以webpack会采用file-loader来进行打包,但是因为没有安装,所以报错。
{
test: /\.(png|jpg|gif)$/i,
use: [{
loader: 'url-loader',
// 当加载的图片,小于limit时,会将图片编译成base64字符串形式
// 当加载的图片,大于limit时,需要使用file-loader模块进行加载
options: {
limit: 1300,
},
}, ],
},
解决办法:
第一种,将limit的值调大一些,让他超过打包图片的大小即可。这种也是最简单的解决办法,第二种是安装file-loader