React Native iOS and Android folders not present

AndroidIosReact NativeExpo

Android Problem Overview


I'm new to react native, and I've been having some trouble understanding the folder structure of the app which should supposedly be present in the project folder on creation. Basically, when creating the project with npm, I get some starting files (App.js etc.) and a node_modules folder. I've got it up and running with expo, which created the .expo folder as well.

However, when I go to react's official documentation or look into plugins/addons on git they talk several times about an android and an iOS folder in the project root. But they are nowhere to be seen. I then got some hints that I could install and run react-native-upgrade-git, which allegedly would generate these missing folders. But that didn't work either.

So what have I missed? Where are those folders located?

Edit: Here is a screen dump from a Youtube tutorial showing the project structure I'm looking for:

enter image description here

Android Solutions


Solution 1 - Android

One of the points of Expo on top of React Native is that you don't go down to android or ios code. Expo deals with those folders for you, you don't need to interact with them. Is there a reason you need those folders? if so, you will have to eject. Here's the documentation to do so: Ejecting with ExpoKit

Solution 2 - Android

You can get to that project structure by running:

npm run eject

However, it removes the app from the Expo framework, which adds a lot of nice benefits and abstraction from the Android/iOS code.

Solution 3 - Android

i think if you want to develop app with ReactNative you start follow this : Getting Started use React Native.

If you create project with ReactNative just write on your terminal like:

react-native init YourProjectName
cd YourProjectName
react-native run-ios //for iOS

I hope my answer helping you to create project with ReactNative. thanks..

Solution 4 - Android

Try this to generate the Android and iOS folder

react-native eject

react-native link

Solution 5 - Android

I think I am little late but follow this steps if you don't want to read any document.

android and ios folder are not present when react native project is created with expo. so you have to detach expo from your project to create android and ios folder.

first add required package name in app.json file

    ios: {
       bundleIdentifier: "com.yourcompany.yourappname",
    },
    android: {
       package: "com.yourcompany.yourappname",
    }

then run below command in terminal

exp detach

after command is successfully executed you will find android and ios folder

Solution 6 - Android

To add to Funk Soul Ninja's answer after following his directions (thank you! :) ), for those who started with an Expo project:

expo run:ios

did the trick for me.

The command creates the ios folder that contains the project that can be edited and built in Xcode.

I did not do this step, but I believe expo run:android does exactly the analogous thing for Android; but I would suggest checking out Expo documentation on adding custom native code.

Solution 7 - Android

Check this Expo document Adding custom native code

In general,

  • to generate ios folder: expo run:ios

  • to generate android folder: expo run:android

Solution 8 - Android

Delete folders android and ios

npm i react-native-eject
react-native eject

Solution 9 - Android

I had to run expo eject. The story behind why I didn't have the folders is had to downgrade my react-native application because of some broken dependencies and then I got build failures. So I deleted the ios and android folders then ran expo eject and got all the build issues fixed. Note that I used expo command line via a script in package json so that the versions would match the version my project was using.

Solution 10 - Android

in the begining install react native, after run expo init YourProject , choose minimal (Typescript) . after that go to YourProject directory and do not run npm start. but run npm run android. hope this help

Solution 11 - Android

This worked for me: Go to Setting and remove both entries "android" and "ios" from "Files:Exclude". Don't forget both environments - User and Workspace.

Removing entries on Workspace: Remove entries

... same for User:

...remove from User

Solution 12 - Android

The simplest way I know

  1. Take your app name from your current app.json, let's say the name is "mynativeapp"

  2. make a new folder somewhere outside of your current project folder

  3. start in it:

react-native init mynativeapp

  1. the command above will make android and ios folders internally compatible by name with your project

  2. copy android/ios folders into your project folder

Now you can try to start your native project. I checked that for Android:

react-native run-android

enjoy!

P.S. "react": "16.9.0", "react-native": "0.61.4"

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionSimon EliassonView Question on Stackoverflow
Solution 1 - AndroidFunk Soul NinjaView Answer on Stackoverflow
Solution 2 - AndroidDanny SullivanView Answer on Stackoverflow
Solution 3 - AndroidmuhammadaaView Answer on Stackoverflow
Solution 4 - Androidomprakash8080View Answer on Stackoverflow
Solution 5 - AndroidmaulikdhameliyaView Answer on Stackoverflow
Solution 6 - AndroidLazarView Answer on Stackoverflow
Solution 7 - AndroidNhat NguyenView Answer on Stackoverflow
Solution 8 - AndroidJéssica Román LargoView Answer on Stackoverflow
Solution 9 - AndroidJosh WoodcockView Answer on Stackoverflow
Solution 10 - AndroidamigatraView Answer on Stackoverflow
Solution 11 - AndroidM_droidView Answer on Stackoverflow
Solution 12 - AndroidKEMBLView Answer on Stackoverflow