when "url" is a function in vite, the path string become a base64 code. I means it use 'inline', but I want 'rebase'.

[l-outsider]

I follow this doc in vite: https://vite.dev/config/shared-options.html#css-postcss

And I want to change the font file path in css after build.

before:

@font-face {
  font-family: iconfont;
  src:
    url("./assets/fonts/iconfont.woff2?t=1722856322648") format("woff2"),
    url("./assets/fonts/iconfont.woff?t=1722856322648") format("woff"),
    url("./assets/fonts/iconfont.ttf?t=1722856322648") format("truetype");
}

after, I want this

@font-face {
  font-family: iconfont;
  src:
    url("../assets/fonts/iconfont.woff2?t=1722856322648") format("woff2"),
    url("../assets/fonts/iconfont.woff?t=1722856322648") format("woff"),
    url("../assets/fonts/iconfont.ttf?t=1722856322648") format("truetype");
}

this is my config:

css: {
    postcss: {
      plugins: [
        postcssUrl({
          url: (asset) => {
            if (!/\.(woff|woff2|ttf)$/.test(asset.pathname || '')) {
              return asset.url;
            }
            // ensure paths are correct in npm publish
            return `../assets/fonts/${asset.url.split('/').pop()}`;
          },
        }),
      ],
    },

But the result is

@font-face{font-family:iconfont;src:url(data:font/woff2;base64,d09GMgABAAAAAAQw

If I understand correctly, it uses inline mode internally, and I want to use a relative path string, so how can I make it use rebase mode?

By the way, I did something similar in rollup, and I did find that it defaulted to rebase mode, which was different from the result of vite.

[l-outsider]

Or should I not do this in the first place? Is there any other way I can achieve my idea?