vue-cli4使用相对路径打包css引用路径应如何设置？

Question

因为需求，打包后的项目可以同时使用域名及IP访问
域名访问的方式：http://www.xxx.com/admin/
而IP访问方式：http://10.0.0.1/
存在一个相对路径的问题，所以vue.config.js打包设置使用的是相对路径，这样保证两种访问方式访问都可以获取到静态文件

vue.config.js:

module.exports = {
    publicPath: './',
}

我将所有图片文件都放置在public目录下：

|-- public
|   |-- img // 存放的静态图片文件
|   `-- index.html

在css设置引入的时候是这么写：

background: url("/img/a.png");

打包后的目录结构：

|-- dist
|   |-- css
|   |-- img
|   |-- js
|   `-- index.html

但在打包后的css文件引入url时却出现了问题，在没有二级目录的情况下，能正常获取图片资源，而使用存在二级目录域名访问，则获取不到。
如果改成background: url("/admin/img/a.png");，则直接访问的情况便获取不到。使用开发者模式改变为background: url("../admin/img/a.png");，则两种方式均可访问。

在开发环境我尝试将css改成相对路径 background: url("../img/a.png");，直接报错。

我尝试搜索打包配置，但只找到了之前版本的配置方法。
所以我想求助下，可以如何进行设置，让打包后的css中url也有一个相对的路径，解决不同级目录访问的问题。

谢谢。