fix(vite): Fix CSS replacement in Vite HMR

Also remove dependency on @rollup/plugin-utils

Motivation

This PR fixes an issue related to Vite plugin originally opened on Pigment CSS repo.

Summary

This change avoids the usage of css content slug in the filename and keeps the css filename unique just by using the path of the original js/ts file and using wyw-in-js prefix before the extension. Using slug had an issue where if you removed a css property from your css definition, it would get applied in a new style tag during dev mode. Thus also keeping the old css in place which would result in overall css being applied from both old and new css content.

The fix instead keeps using the same filename regardless of the content and just pings the FE to reload the latest CSS content which it replaces in the existing style tag instead of adding a new one.

I also removed the explicit dependency of @rollup/plugin-utils since vite already re-exports those.

Test plan

Tested locally using this repo for the bug reproduction and fix.

Anber / wyw-in-js