Align expo-tailwind-setup with official Nativewind v5 install docs#101
Draft
danstepanov wants to merge 2 commits into
Draft
Align expo-tailwind-setup with official Nativewind v5 install docs#101danstepanov wants to merge 2 commits into
danstepanov wants to merge 2 commits into
Conversation
Replace the pinned react-native-css nightly with @latest. Stale nightlies fall behind the React Native peer range and fail install with ERESOLVE on newer Expo SDKs. Point nativewind at the preview dist-tag instead of a specific preview build for the same reason, and add a troubleshooting entry covering the ERESOLVE failure. Also fix the brand casing to Nativewind (lowercase w) throughout.
Match the installation steps to the Nativewind v5 documentation: - Split the install into runtime deps (nativewind@preview, react-native-css@latest, react-native-reanimated, react-native-safe-area-context) and dev deps (tailwindcss, @tailwindcss/postcss, postcss) - Add the missing @import "nativewind/theme" to global.css - Use plain withNativewind(config) with no options; the default globalClassNamePolyfill gives className support on all React Native components - Add the missing import-your-CSS-file step with the Fast Refresh warning - Show lightningcss pinning for npm, yarn, pnpm, and bun, with the deserialization error it prevents - Replace the TypeScript section with the nativewind-env.d.ts triple-slash reference setup and naming caveats - Reframe the useCssElement wrapper setup as an optional section for projects that disable the polyfill, instead of the default path - Expand troubleshooting to match
danstepanov
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This updates expo-tailwind-setup to match the official Nativewind v5 installation docs and fixes a couple of things that have been generating issue reports.
The skill pinned react-native-css to a specific nightly build. Nightlies go stale, fall behind the React Native peer dependency range, and fail install with ERESOLVE on newer Expo SDKs. The install now uses react-native-css@latest and the nativewind preview dist-tag so it does not go stale again, and there is a troubleshooting entry for the ERESOLVE failure.
The setup steps now follow the official docs: peer deps react-native-reanimated and react-native-safe-area-context are included, Tailwind packages install as dev deps, global.css imports nativewind/theme, the CSS file import step is included with the Fast Refresh warning, lightningcss pinning is shown for each package manager, and the TypeScript section covers the nativewind-env.d.ts triple-slash reference. The metro config is plain withNativewind(config) since the default globalClassNamePolyfill gives className support on all React Native components. The useCssElement wrapper setup that was previously presented as required is still there, reframed as an optional section for projects that disable the polyfill.
It also fixes the brand casing across the repo. The project is stylized Nativewind, with a lowercase w.
I maintain Nativewind, happy to answer any questions.