ENOENT: no such file or directory when running npx gluestack-ui add <component>

[Jairgo]

Description

Running the command npx gluestack-ui add avatar results in an error on Windows environments, indicating that a file or directory is missing. This issue occurs with any component (not just Avatar) and only happens on Windows machines. The error does not occur on macOS environments.

CodeSandbox/Snack link

https://github.com/Jairgo/PublicForkCuckoApp

Steps to reproduce

Steps to reproduce the issue:

1. Clone the repository where the issue occurs: git clone https://github.com/Jairgo/PublicForkCuckoApp
2. Navigate to the project directory: cd PublicForkCuckoApp
3. Install the dependencies: npm install
4. Run the following command to add a component: npx gluestack-ui add avatar
5. On Windows environments, the error occurs immediately after the Gluestack-UI welcome message.

gluestack-ui Version

v2

Platform

• [X] Expo
• [ ] React Native CLI
• [ ] Next
• [ ] Web
• [ ] Android
• [ ] iOS

Other Platform

No response

Additional Information

Command executed:
npx gluestack-ui add avatar

Error output:

Welcome to gluestack-ui!
│
■  ENOENT: no such file or directory, scandir 'C:\Users\UserA\.gluestack\cache\gluestack-ui\example\storybook-nativewind\src\core-components\hooks'

Context:

1. Operating System (affected): 4 Windows 11; (3 dev machines) and one additional Windows machine to replicate the issue.
2. Operating System (not affected): macOS (2 machines)
3. Node.js version: v20.17.0
4. npm version: 10.8.3
5. GLUESTACK-UI CLI version: 0.7.10
6. Code editor: (VSCode)

Steps to reproduce the issue:

1. Clone the repository where the issue occurs: git clone https://github.com/Jairgo/PublicForkCuckoApp
2. Navigate to the project directory: cd PublicForkCuckoApp
3. Install the dependencies: npm install
4. Run the following command to add a component: npx gluestack-ui add avatar
5. On Windows environments, the error occurs immediately after the Gluestack-UI welcome message.

Attempted solutions:

1. npm cache clean --force
2. npm install gluestack-ui@latest
3. Tried to manually delete C:\Users\UserA\.gluestack but it does not exist.

Notes:

• The component should be added to the project without errors.

• This issue affects 3 team members using Windows and an additional Windows machine. 2 team members on macOS do not experience this problem.

• The issue occurs with any component when running npx gluestack-ui add .

[Viraj-10]

Hey @Jairgo, We are working cli issue on windows. Meanwhile you can please install them using manual installation?

[TudorCRL]

Hey @Jairgo, I was literally about to report what sounds like the exact same bug on Mac! I and my team found a solution which is the king of jank but works for now.

It seems for us the issue was that in order to run gluestack's add command, you need the .gluestack folder along with cache installed in your home directory (hence the "no such file or directory" message). This is normally installed during the process of running the gluestack-ui init command. So for most people this works just fine. However, if you are co-working with people on a repo and one of your colleagues set up the gluestack elements of the repo which you have cloned, then you will never have run the init command on your own machine. Trying to run it again in the existing repo doesn't work because gluestack complains that it's already initialised. Now you're left without the essential cache folder and nothing works!

Our soluton was to:

1. create a separate stub repo
2. run npm init
3. run npx gluestack-ui init
4. wait for the CLI to run
5. check the .gluestack folder was present in our home folder

After that, we were able to run gluestack-ui add commands in the original repo. We then deleted the stub repo as a cleanup step.

Hope this helps!

[Jairgo]

Hey @TudorCRL , Thank you so much for sharing that solution! It worked for me, but instead of creating a separate stub repo, what I did was switch to a branch that didn’t yet have the gluestack changes. Then, I ran the gluestack-ui init command on that branch. After it completed, I just discarded the changes in Git and switched back to my working branch. Everything is now working perfectly, and I can use the gluestack-ui add commands without any issues!

Thanks again, this definitely saved me a lot of trouble!

[vaibhk20]

Closing the issue as the concerned issue has been resolved in the latest version of gluestack-ui CLI. Please feel free to reopen this if you face any issue while using it.

[juandpr]

I still have this issue with the latest version of gluestack-ui ond Mac