Vite打包后SCSS引用的图片路径不对，该如何解决？

Question

为什么vite打包后scss中引用的图片路径不对
vite配置如下：

build: {
    rollupOptions: {
      // 静态资源分类打包(部署要区分js,css,img文件夹，对应后端的配置)
      output: {
        chunkFileNames: 'js/[name]-[hash].js',
        entryFileNames: 'js/[name]-[hash].js',
        assetFileNames: (assetInfo) => {
          if (extname(assetInfo.name) === '.css') {
            return `css/[name]-[hash].[ext]`;
          } else {
            return `img/[name]-[hash].[ext]`;
          }
        }
      }
    }
  }

scss文件和图片文件目录结构如下：

打包后的目录结构：

打包后的css文件中的图片引用：

打包后正确的引用路径应该是这样：url(../img/add-1bd6048f.svg)

大佬问解惑下，为什么打包后的图片引用不对。
如果可以，不改变现有的文件目录和打包后的目录结构
现有的项目文件目录要合规范，所以这样放置。
打包后的目录是部署要求要这样的结构。

Answer 1

原因找到了
这次服务器上前端部署的地址是：
a/b/前端资源
一开始没注意，没配置base，打包后资源定位不正确，页面打不开
后来改了base，配置为./页面打开了以为就可以了.
现在改成：base: '/a/b'就好了

Answer 2

这个图片不需要被 vite 处理的，放在 public 目录下，使用 /pic-name.svg 引入。