skills.rest
codeAbinash
codeAbinashCOMMUNITY
Explore all skills by this author →
Website𝕏@codeAbinashGitHub

migrate-nativewind-to-uniwind

Migrate React Native projects from NativeWind to Uniwind with Tailwind 4 upgrade.

5|Updated Aug 4, 2024
Search Tags:#migration#tailwind#react-native#uniwind#nativewind#config-migration#css-interop
One-click install
npx skills add https://github.com/codeAbinash/tech-triangle --skill migrate-nativewind-to-uniwind-codeabinash
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: migrate-nativewind-to-uniwind
Source: https://github.com/codeAbinash/tech-triangle/tree/main/.agents/skills/migrate-nativewind-to-uniwind
Command: npx skills add https://github.com/codeAbinash/tech-triangle --skill migrate-nativewind-to-uniwind-codeabinash

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Migrate a React Native project from NativeWind to Uniwind. Use when the user wants to replace NativeWind with Uniwind, upgrade from NativeWind, switch to Uniwind, or mentions NativeWind-to-Uniwind migration. Handles package removal, config migration, Tailwind 4 upgrade, cssInterop removal, theme conversion, and all breaking changes.

Core Features & Use Cases

  • Guided migration from NativeWind to Uniwind across the project, including package removal and Tailwind 4 upgrade.
  • Comprehensive config migrations: update babel.config.js, metro.config.js, and removal of tailwind.config.js.
  • Theme conversion: migrate NativeWind vars/themes to Uniwind CSS variables and @variant-based theming.
  • Cleanup and validation: remove deprecated tooling such as react-native-css-interop, verify rem/polyfills and safe area utilities.

Quick Start

Follow the migration guide to convert a NativeWind-based React Native project to Uniwind by updating packages, configs, CSS, and theme handling.

Frequently Asked Questions about migrate-nativewind-to-uniwind

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate a React Native project from NativeWind to Uniwind?▼

Migrating from NativeWind to Uniwind involves removing legacy packages, updating babel.config.js and metro.config.js, deleting tailwind.config.js, upgrading to Tailwind 4, and converting theme definitions to Uniwind CSS variables.

What breaking changes happen when upgrading NativeWind to Tailwind 4?▼

Upgrading NativeWind to Tailwind 4 removes cssInterop, deletes tailwind.config.js, and migrates NativeWind vars to Uniwind CSS variables and @variant-based theming across your React Native project.

Do I need to remove react-native-css-interop when switching to Uniwind?▼

Yes, switching to Uniwind requires removing react-native-css-interop and other deprecated NativeWind tooling, followed by validating rem polyfills and safe area utilities to ensure a clean configuration transition.

How do I convert NativeWind theme definitions to Uniwind CSS variables?▼

Converting NativeWind themes to Uniwind involves migrating NativeWind vars to Uniwind CSS variables and applying @variant-based theming, while removing the legacy tailwind.config.js file required by Tailwind 3.

What configuration files need updating to replace NativeWind with Uniwind?▼

Replacing NativeWind with Uniwind requires updating metro.config.js and babel.config.js, removing tailwind.config.js, and deleting nativewind-related files to complete the config migration and Tailwind 4 upgrade.

Related Skills

Explore More Software Engineering Skills→
emran-niftyitsolutionemran-niftyitsolution

migrate-nativewind-to-uniwind

Migrate React Native projects from NativeWind to Uniwind with config and theme updates.

Community
Advanced
kirklinkirklin
7

migrate-nativewind-to-uniwind

Migrate React Native projects from NativeWind to Uniwind with Tailwind v4 and CSS theming.

Community
Advanced
AlanCasalAlanCasal

uniwind

Configure Uniwind for React Native with Tailwind 4 CSS-first syntax.

Community
Advanced
MarJose123MarJose123

migrate-nativewind-to-uniwind

Automate NativeWind to Uniwind migration in React Native projects.

Community
Advanced