styling-nativewind-v4-expo

Installation
SKILL.md

NativeWind v4 in Expo

This is deliberately a v4 skill. On the review date, the official site labels v5 a prerelease; v5/Tailwind v4 configuration is a separate stack, not a drop-in refresh of these files. Inspect the lockfile before editing and keep this skill's dependency majors explicit.

Establish the configuration

Read package.json and the lockfile, the actual app entry, Expo config, Babel config, Metro config, Tailwind config, and the CSS entry. Identify Expo Router versus a classic entry and account for src/app, monorepos, or a custom project root.

Use references/expo-setup.md for the coordinated v4 setup. The invariant is:

  • nativewind@^4 with tailwindcss@^3.4.17; native peers resolved through the app's Expo SDK.
  • nativewind/preset and content globs covering every source of complete utility strings.
  • One CSS entry using the Tailwind v3 directives, connected to both Metro's withNativeWind input and the real application entry.
  • nativewind/babel in Babel presets, with jsxImportSource: "nativewind" on babel-preset-expo.
  • nativewind-env.d.ts referencing nativewind/types, without shadowing the package/module name.

Preserve unrelated Metro wrappers, Babel plugins, config plugins, and project module format. Do not replace a working app's configuration wholesale or install a second incompatible Reanimated/Worklets stack.

Debug in a useful order

Installs
407
GitHub Stars
3
First Seen
Feb 9, 2026