unocss-transformer-css-url-rebase

A Unocss transformer that converts relative paths in 'url(...)' to absolute paths based on the project root, allowing Vite to recognize and handle these assets.

Install

pnpm i -D unocss-transformer-css-url-rebase

// uno.config.ts
import { defineConfig } from 'unocss'
import transformerCssUrlRebase from 'unocss-transformer-css-url-rebase'

export default defineConfig({
  // ...
  transformers: [
    transformerCssUrlRebase({
      root: __dirname,
    }),
  ],
})

Configuration

Option	Type	Default	Description
root	string	undefined	The root directory of the project. Not setting this will not affect the actual generated styles, it only affects the prompt function of the VSCode Unocss extension.