Build/preview regression: RNW Tailwind classes ignored since 1.2.7

[dannyhw]

Summary

Tailwind v4 utilities apply to regular DOM elements, but do not apply to React Native Web components after vite build + vite preview with uniwind >= 1.2.7.

Repro

Repo: https://github.com/dannyhw/uniwind-rnw-build-repro

Steps:

1. npm i
2. npm run build
3. npm run preview

Observed:

• <p> is italic (Tailwind OK)
• RNW Text / View classes are present but styles are not applied

Expected:

• font-bold text-red-500 → red + bold
• bg-blue-500 p-4 mt-4 → blue background + padding + margin
• text-white font-bold → white + bold

You can also see the same in the vite example app in this repo, when you run the build the text is not styled at all

Analysis

• In 1.2.6, dist/module/components/web/rnw.js moved RNW CSS rules into @layer rnw at runtime.
• In 1.2.7, that runtime move was removed.
• 1.2.7 adds an optimizeDeps esbuild patch (PR fix: patch rnw to wrap default styles with css layer #337) for createOrderedCSSStyleSheet, but it only runs in dev.
• Build/preview still uses the unlayered RNW stylesheet, so it overrides Tailwind v4 layered utilities.

Proposed fix (one option)

Apply the same resolve patch in build (Rollup/Vite), not just optimizeDeps. For example something like this:

const rnwLayeredStyleSheet = {
  enforce: "pre",
  name: "rnw-layered-stylesheet",
  resolveId(source, importer) {
    const isTarget =
      source === "./createOrderedCSSStyleSheet" ||
      source.endsWith(
        "react-native-web/dist/exports/StyleSheet/dom/createOrderedCSSStyleSheet.js"
      );
    if (isTarget && importer?.includes("react-native-web/dist/exports/StyleSheet")) {
      return require.resolve(
        "uniwind/dist/module/components/web/createOrderedCSSStyleSheet.js"
      );
    }
  },
};

(I left this fix the repro’s vite.config.js.)

Thanks!

[dannyhw]

Update: the repro repo now includes a working build-only fix gated by env var.

Enable it like this (must be set at build time, not preview):

UNIWIND_RNW_LAYER_FIX=1 npm run build
npm run preview

[Brentlok]

This is a model contribution! Thank you for the excellent documentation and tests. It’s rare to see an issue filed with a fix ready to go, great work! 🚀