打包后的图片路径异常

项目打包后，不同路径相同名称的图片会出现错乱问题，是因为打包时缺少配置

在vue.config.js文件中添加以下内容

module.exports{
　　config.module
      .rule('images')
      .test(/\.(png|jpe?g|gif|webp)(\?.*)?$/)
      .use('url-loader')
      .loader('url-loader')
      .tap(options => {
        // 修改它的选项... 图片命名增加 hash 值，预防相同图片缓存和 不同目录下的同名文件相互覆盖问题
        options.fallback.options.name = 'img/[name].[hash:7].[ext]'
        options.limit = 1024
        // 这是字节(Byte)限制，1KB = 1024Byte ,当图片的大小小于 1KB ,则会被转为 base64格式，打包进js文件，大于1KB,则会被打包进 img 文件夹，供链接请求获取。
        return options
     })
}