菜单
Guide for installing gluestack-ui v4 per the official Installation doc - CLI and Manual paths only. Follow https://v4.gluestack.io/ui/docs/home/getting-started/installation strictly.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | gluestack-ui-v4:setup |
| description | Guide for installing gluestack-ui v4 per the official Installation doc - CLI and Manual paths only. Follow https://v4.gluestack.io/ui/docs/home/getting-started/installation strictly. |
This sub-skill follows the official gluestack-ui v4 installation guide only. Nothing is followed from outside Installation | gluestack-ui v4.
Use either CLI or Manual as defined on that page.
@gluestack/styled, @gluestack-ui/themed, or any packages/docs from gluestack.io (without the v4. subdomain). Those are for v1/v2/v3.@gluestack-ui/core, @gluestack-ui/utils, NativeWind, and components copied into your app (e.g. GluestackUIProvider, icon, overlay, toast). Manual installation for v4 is only the Manual tab on the v4 Installation page – not any other “manual” or “gluestack styled” guide.Ensure these prerequisites are satisfied to use the gluestack-ui CLI:
| Package Name | Supported Versions | Upcoming Support |
|---|---|---|
| next | 13 <= versions <= 15 | - |
| react-native | versions >= 72.5 | - |
| expo | versions >= 50 | - |
| node | versions > 16 | - |
To initialize gluestack-ui v4 via CLI, use only this command (from your project root):
npx gluestack-ui init -y
This adds GluestackUIProvider and essential components (icon, overlay, toast). Do not use any other command or method for CLI initialization.
After init, your project is ready to use gluestack-ui components. To add more components via CLI, use the add command or the CLI guide. Example:
npx gluestack-ui add box
or
npx gluestack-ui add --all -y
If you run into issues during CLI installation, use the manual installation guide (Manual tab on the same Installation page).
For installation without the CLI, use only the Manual tab on the v4 Installation page:
Do not:
v4.), or from blog posts, Stack Overflow, or other guides that reference v1/v2/v3.@gluestack-ui/core, @gluestack-ui/utils, NativeWind, and the provider/components from the v4 Manual tab only.Expo app stuck in tailwindcss(ios) rebuilding... while running expo start
Expo App).Expo-App).@gluestack/styled or v1/v2/v3.Enforces constrained, opinionated styling patterns for gluestack-ui v4. Main overview skill that coordinates specialized sub-skills for setup, components, styling, variants, performance, and validation.
Migrate a gluestack-ui project from v2, v3, or v4 to v5 (NativeWind v5 or UniWind). Covers automated CLI upgrade and manual step-by-step migration for all source versions.
Main entry point for gluestack-ui contributor tasks and workflows
Create a new React Native/Expo component with guided workflow following compound component API pattern
Create or modify gluestack-core and gluestack-utils packages for component creators and utilities
Component usage patterns for gluestack-ui v4 - covers component selection, props vs className, compound patterns, icons, and provider setup.