react native - Expo Router 52 not detecting files and directories in app directory - Stack Overflow

I am using React Native Expo Router SDK 52 that uses file-based routing to navigate between screens. I am experiencing a slight malfunctioning of either VS Code or Expo and I have closed VS Code and restarted it many times but it was not solved. Expo is not detecting some files and directories created inside app directory, so it is not allowing other pages to navigate to those undetected files and directories. Normally, Expo treats all files and directories inside the app directory as route but it is not detecting some files and directories inside the app directory.

*****What I have tried

I have closed and opened VS Code but it is still not detecting some screens in the app directory. Expo did not detect some files and directories created in the app directories when I use the following code:

router.push('/')
router.navigate('/')
......

The Expo 52 comes with (tab) directory inside the app directory, it can detect the (tab) directory and i created another directory called (users), it detected this (users) directory but not all the files inside it and it did not detect (payments) directory and the files in it.

What could be the problem please?

This is how my directory structure looks like below

enter image description here

I am using React Native Expo Router SDK 52 that uses file-based routing to navigate between screens. I am experiencing a slight malfunctioning of either VS Code or Expo and I have closed VS Code and restarted it many times but it was not solved. Expo is not detecting some files and directories created inside app directory, so it is not allowing other pages to navigate to those undetected files and directories. Normally, Expo treats all files and directories inside the app directory as route but it is not detecting some files and directories inside the app directory.

*****What I have tried

I have closed and opened VS Code but it is still not detecting some screens in the app directory. Expo did not detect some files and directories created in the app directories when I use the following code:

router.push('/')
router.navigate('/')
......

The Expo 52 comes with (tab) directory inside the app directory, it can detect the (tab) directory and i created another directory called (users), it detected this (users) directory but not all the files inside it and it did not detect (payments) directory and the files in it.

What could be the problem please?

This is how my directory structure looks like below

enter image description here

• react-native
• expo
• expo-router

Share Improve this question Follow edited Feb 3 at 17:50 Raul Hernandez asked Feb 3 at 14:37 Raul HernandezRaul Hernandez 1144 bronze badges 4

• It's hard to help you, because you didn't give any information how your code looks. Please check examples of expo router, maybe you have some bad folder structure - github.com/binarapps/baca-react-native-template/tree/main/app - github.com/obytes/react-native-template-obytes/tree/master/src/… – Mateusz Rostkowski Commented Feb 3 at 16:40
• @MateuszRostkowski Thank you for your concern, it is not about my code. This has nothing to do with code, i have edited the question and add the structure of my project directories. It is just that when i tried to navigate to another screen from the current screen, expo isn't detecting the directory (store-merchant) and all the files in it and also it could not detect changes to directories or file names in the /app directory. It is not a code thing, i was thinking it is about configuration, but there is no special configuration about making files in /app directory detected. It is automatic – Raul Hernandez Commented Feb 3 at 17:56
• Do you have a _layout.tsx file inside (store_mechant) and (users)? – Chibuokem Onyekwelu Commented Feb 3 at 19:28
• @ChibuokemOnyekwelu no i don't have _layout.tsx in the directory i created. Thank you very much, i think that file is quiet important. I will appreciate your kind advise and assistance. – Raul Hernandez Commented Feb 4 at 8:46

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You'll need to create a _layout.tsx file inside each subdirectory. Inside this _layout.tsx file, you'll need to define the structure for the navigation:

...

<Stack>
  <Stack.Screen name="screen1" />
  <Stack.Screen name="screen2" />
  ...
</Stack>

...