To get started with gluestack-ui v3, check out this quick installation guide. It provides simple steps to help you install and use the library in your projects.
Step 1: Setup your project
If you are starting with a new project, setup your project with Next.js or Expo If you already have a project, you can skip this step.
Prerequisites
Ensure you have the following prerequisites installed on your project to use gluestack-ui CLI:
Package Name
Supported Versions
Upcoming Support
next
13 <= versions <= 15
-
react-native
versions >= 72.5
-
expo
versions >= 50
-
node
versions > 16
-
Step 2: Initialize
Go to your project, and use the
init
command at the root of your project to add
GluestackUIProvider
and essential components (
icon
,
overlay
,
toast
) to your project.
npx gluestack-ui init
Your project is now ready to use gluestack-ui components. To add gluestack-ui components to your project using the CLI, refer to the above command or use the CLI guide.
npx gluestack-ui add box
If you encounter issues during the CLI installation, refer to the manual installation guide available.
Common issues
Expo app stuck in
tailwindcss(ios) rebuilding...
while running
expo start
commandIn this case, you may have your app stored in a directory with a name containing spaces, such as 'Expo App', renaming it to just 'Expo-App' will resolve the issue.