Skip to content

🚨 [Bug] GlueStack UI Not Working in React Native Web (Missing Dependencies) #2797

Open
@Prashanth-K-25

Description

@Prashanth-K-25

Description

When I install GlueStack UI in a React Native Web CLI project, it does not work. Running npm run web results in missing dependencies errors for @gluestack-ui/toast and @gluestack-ui/tooltip. This issue happens on a fresh installation of GlueStack UI, and the web build fails due to these missing dependencies. Manually installing @gluestack-ui/toast and @gluestack-ui/tooltip fixes the issue, but these packages should be included by default when initializing GlueStack UI.

CodeSandbox/Snack link

https://codesandbox.io/p/github/Prashanth-K-25/test/main?import=true

Steps to reproduce

Steps to Reproduce:

Create a new React Native project:
npx react-native init MyApp
cd MyApp

Install GlueStack UI:
npx gluestack-ui@latest init

Run the project on web:
npm run web

The build fails with missing module errors.

Expected Behavior:
GlueStack UI should work out of the box in React Native Web.
Running npm run web should not fail due to missing modules.

Actual Behavior:
The project does not run on web.
Missing dependencies cause the build to fail.
Manually installing @gluestack-ui/toast and @gluestack-ui/tooltip resolves the issue.

Error Logs:

ERROR in ./node_modules/@gluestack-ui/themed/build/components/Toast/index.js 2:0-67
Module not found: Error: Can't resolve '@gluestack-ui/toast'

ERROR in ./node_modules/@gluestack-ui/themed/build/components/Tooltip/index.js 2:0-54
Module not found: Error: Can't resolve '@gluestack-ui/tooltip'

gluestack-ui Version

1.1.7

Platform

  • Expo
  • React Native CLI
  • Next
  • Web
  • Android
  • iOS

Other Platform

No response

Additional Information

This issue occurs in a fresh React Native Web project after initializing GlueStack UI.

Metadata

Metadata

Assignees

Labels

bugSomething isn't working

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions