在安装过 npm i url-loader file-loader -D后，执行webpack命令报错

image.png

1.查看url-loader和file-loader有没有安装好，如果没有，重新安装
npm i url-loader file-loader -D
或者删去文件中的package.json和webconfig拿之前可行的package.json和webconfig，重新安装npm i，将node_modules安装上去

2.检查图片是否放在了 src/assets/images 下
图片一定要放在assets中

3. 查看图片的后缀名大小写是否一致
   看webconfig中的路由配置中，图片配置的后缀是png还是PNG，引用的时候以及images中的图片后缀也要对应一致
   写成 test: /.(png|jpg|gif|svg)$/报错了，改成如下 successfully

 {
        // 处理图片资源
        test: /\.(PNG|JPG|GIF|SVG)$/,
        // 只使用一个loader处理，写法如下：
        // 下载 url-loader 和 file-loader
        loader:'url-loader',
        // loader的配置可以通过option来配置
        options: {
          // 图片大小小于12kb，就会base64处理
          // 通常我们只会对8-12kb以下的图片进行base64处理
          // 优点：减少请求数量（减轻服务器压力）
          // 缺点：图片体积会更大（文件请求速度更慢）
          limit: 12 * 1024
        }
      }