How can I regenerate ios folder in React Native project?

Question

So a while ago I deleted the /ios directory in my react native app (let's call it X). I've been developing and testing using the android emulator but now I'd like to make sure it works on ios with xcode simulator etc.

So my current idea is to create a new react native bare project (let's call it Y) with ios folder, then follow these steps to rename Y so that it has the name of X and then moving the /ios directory from Y into X and trying to run-ios.

I'll update here how that goes, but I wondered if there is a better way and has nobody been in this situation before?

I've googled lots of things 'regenerate ios folder' 'deleted ios folder' 'add ios folder to existing..' and nothing helpful. Maybe my googlefu isn't good enough but if anyone has any suggestions, much appreciated.

Step 2 will be making sure it compiles because of dependencies and stuff but for now my goal is to just get the /ios folder back in the project and for React Native to be aware of it's existence (it has all the necessary config).

Thanks

try commands given in this post https://stackoverflow.com/a/65776701/1948482 it will help you. — Kshitij, Jan 18 '21 at 14:50

score 125 · Accepted Answer · edited May 23 '17 at 12:18

125

The process you need to follow is so similar to renaming a react native app. Basically you just need to run react-native upgrade in your root project directory. For further info you can check another question here. The instructions below explains how to create another react native project based on a copied one with a new name.

First copy the directory which your to-be-name-changed application exists. And go to your newly cloned directory.
Change the name at index.ios/android.js file which is given as a parameter to AppRegistry.
Change the name and version accordingly on package.json
Delete /ios and /android folders which are remaining from your older app.
Run $react-native upgrade to generate /ios and /android folders again.
Run $react-native link for any native dependency.
Finally run $react-native run-ios or anything you want.

edited May 23 '17 at 12:18

Community

1
1

answered Feb 28 '17 at 11:16

milkersarac

3,399
3
31
31

7

It's not recommended to use `react-native upgrade` anymore, it should be replaced with `react-native-git-upgrade`. – wmcbain Feb 28 '17 at 14:44
23

@wmcbain The reason I use `react-native upgrade` is just to re-generate `/ios` and `/android` project folders. It does not changes/updates/upgrades react native version as its name may imply. However I see that `react-native-git-upgrade` is more appropriate if you want to change the react native version of your project. – milkersarac Feb 28 '17 at 16:40
If you have for example ios app icons inside of ios, you should not delete that folder... – brunocascio Oct 11 '17 at 00:26
Hi, I cant found the files `index.ios/android.js`. Help me to find it. Thanks – Italo Rodrigo Jan 03 '18 at 19:02
Hi, they are like [this](https://github.com/start-react/native-starter-kit/blob/master/index.android.js) and [this](https://github.com/start-react/native-starter-kit/blob/master/index.ios.js). They are fundamental for your project, if they are absent from your repo somehow you can add them manually. – milkersarac Jan 04 '18 at 06:44
3

react-native eject works for me instead of upgrade,..with rest steps same. – Alok Mar 22 '18 at 06:01
i want to generate only ios folder not android – Yusuf Feb 04 '21 at 06:49
1

@Yusuf If the process is still valid to produce `/ios` and `/android` folders, in the end just delete `/android` to get rid of it. – milkersarac Feb 04 '21 at 07:05
`react-native eject` was removed and does not seem to work anymore as well other options :-( creating a new project an copying files by hand seems silly for this kind of mature frameork :-( – CeDeROM Aug 28 '21 at 21:45
@milkersarac `It does not changes/updates/upgrades react native version as its name may imply. ` yes it does – ICW Apr 08 '22 at 15:05

Khurshid Ansari · Answer 2 · 2021-03-07T09:45:12.070

82

Simply remove/delete android and ios (keep backup android and ios folder) and run following command:

  react-native eject

Supported version : 
    react-native <= 0.59.10
    react-native-cli <= 1.3.0 



   react-native upgrade --legacy true

Supported version : 
        react-native >= 0.60.0
        react-native-cli >= 2.1.0

Ref : link

Edited(March 2021)

npm i react-native-eject
npm i @react-native-community/cli
react-native eject

will generate the both android and ios folder.

Ref.: link

edited Mar 07 '21 at 09:45

answered Sep 20 '18 at 17:14

Khurshid Ansari

4,638
2
33
52

4

`react-native upgrade` (or `react-native-git-upgrade`) both didnt work for me. Simply running `react-native eject` worked perfectly. Thanks! – lsimonetti Jun 14 '19 at 19:24
7

`react-native eject` appears to have been removed as of React Native 0.60. My `react-native-cli` is version `2.0.1`. – Valdimar Jul 10 '19 at 11:12
4

`upgrade --legacy` seems to be removed too. `error: unknown option --legacy` – Rin Minase Nov 30 '19 at 12:19
2

Looks like both of these options have been removed. Recommendation now is to init a new project and copy of the files manually. e.g. `npx react-native init YourProjectName` – Nathan May 15 '20 at 11:47
2

The edited comment (install react-native-eject... cli... and execute eject) worked for me – Klian Jul 27 '22 at 06:26

score 29 · Answer 3 · answered Jul 12 '19 at 22:44

29

Note as of react-native 0.60.x you can use the following to regenerate ios/android directories:

react-native upgrade --legacy true

Credit here: https://github.com/facebook/react-native/issues/25526

answered Jul 12 '19 at 22:44

groundtruth-andy

290
3
5

This command also worked for react-native v0.59.x with react-native-cli v2.0.0. We can specify version to keep the same react-native version: ```react-native upgrade 0.59.10 --legacy true``` – Ashwin Aug 05 '19 at 02:09
10

this does not work on 0.61.5: `error: unknown option '--legacy'` – ekkis Feb 13 '20 at 22:12

score 7 · Answer 4 · answered Jun 12 '21 at 09:42

Working steps 2021.

Delete /ios /android
Change the app name to new name in /app.json and package.json
Run npx react-native upgrade - this is important even if platform files are not generated.
Create a separate directory and run npx react-native init NewProjectName there.
Copy ios and android folders from generated project to the old project
Run pod install in /ios in old project
Run cd .. && npx react-native run-ios

score 4 · Answer 5 · answered Sep 14 '18 at 22:11

4

As @Alok mentioned in the comments, you can do react-native eject to generate the ios and android folders. But you will need an app.json in your project first.

{"name": "example", "displayName": "Example"}

answered Sep 14 '18 at 22:11

aleclarson

18,087
14
64
91

Your approach is valid if you have created your project with CRNA. I suspect when question answered CRNA even exists. Anyway the original answer targets the projects have been created with `react-native init`. One popup question, what would you do when `ios` and `android` folders are deleted after you have already ejected your project? – milkersarac Sep 17 '18 at 07:26
1

@milkersarac `react-native eject` works even if the project is not created with CRNA – aleclarson Sep 17 '18 at 15:25

score 3 · Answer 6 · answered Oct 30 '19 at 09:05

It seems like react-native eject is no more available. The only way I could find for recreating the ios folder was to generate it from scratch.

Take a backup of your ios folder

mv /path_to_your_old_project/ios /path_to_your_backup_dir/ios_backup

Navigate to a temporary directory and create a new project with the same name as your current project

react-native init project_name
mv project_name/ios /path_to_your_old_project/ios

Install the pod dependencies inside the ios folder within your project

cd /path_to_your_old_project/ios
pod install

This is currently the correct answer according to this discussion: https://github.com/react-native-community/cli/pull/275 — Nathan, May 15 '20 at 11:48

score 3 · Answer 7 · answered Dec 16 '19 at 18:18

3

❯ react-native eject

error Unrecognized command "eject". info Run "react-native --help" to see a list of all available commands.

❯ react-native upgrade --legacy true

error: unknown option `--legacy'

You can init a new project that's named the same in another folder and copy ios dir over:

inside YourProjectName directory

npx react-native init YourProjectName
mv YourProjectName/ios ios
rm -rf YourProjectName

Make sure you have clean git history before doing so, in case you need to revert

answered Dec 16 '19 at 18:18

akio an

353
3
14

1

I did this but now when I npx react-native run-ios it just runs the demo "welcome to react" project instead of the existing App.js code. Am I missing a step? – WMartin Jul 14 '20 at 12:36
@WMartin you're suppose to move the ios folder to your previous project and run the app there – Nicolas Silva Mar 26 '21 at 02:51

Aijaz Ali Gopang · Answer 8 · 2020-09-13T21:23:49.360

2

Open Terminal/cmd
Move to the folder/directory where the project "ProjectName" folder exist(Do not go into project directory)
run command as: react-native init "ProjectName" and it will warn that project directory already exist but you continue.
It will install all updated node modules as well as missing platform (android/ios) folders inside project without disturbing the code already written.
cd "ProjectName" and then cd ios and then run pod install

PS: Take backup of your code in case it changes App.js

edited Sep 13 '20 at 21:23

answered Sep 13 '20 at 21:15

Aijaz Ali Gopang

326
3
9

This doesn't work any more since 2021. You will get: `Cannot initialize new project because directory "project1" already exists.` – Wayne Mao Aug 25 '22 at 01:50

score 1 · Answer 9 · answered Apr 26 '18 at 08:56

1

This is too late, but for anyone who is still having same issue and have a detached react native app, what i did for me I just run exp detach over my detached app and it created ios folder!

answered Apr 26 '18 at 08:56

Mizlul

1
7
41
100

score 1 · Answer 10 · answered Jul 11 '19 at 23:00

Since react-native eject is depreciated in 60.3 and I was getting diff errors trying to upgrade form 60.1 to 60.3 regenerating the android folder was not working.

I had to

rm -R node_modules

Then update react-native in package.json to 59.1 (remove package-lock.json)

Run

npm install

react-native eject

This will regenerate your android and ios folders Finally upgrade back to 60.3

react-native upgrade

react-native upgrade while back and 59.1 did not regenerate my android folder so the eject was necessary.

score 1 · Answer 11 · edited Aug 09 '20 at 05:52

I just found myself with this problem too, but I just solved it.

Surely when running the "react-native upgrade" command, it gave them the message that it was not necessary to update or with the command "react-native eject" that the command is not recognized.

react-native upgrade

Now you should use the react-native upgrade --legacy true command to back up your android folders or ios as the case may be as this command will replace your files.

react-native upgrade --legacy true

Now it's just telling you not to replace your package.json

score 1 · Answer 12 · answered Jun 28 '20 at 16:08

If you are lost with errors like module not found there is noway other the than following method if you have used react native CLI.I had faced similar issue as a result of openning xcode project from .xcodeproj file instead of .xcworkspace. Also please note that react-native eject only for Expo project.

The only workaround to regenarate ios and android folders within a react native project is the following.

Generate a project with same name using the command react-native init
Backup your old project ios and android directories into a backup location
Then copy ios and android directories from newly created project into your old not working project
Run pod install within the copied ios directory

Now your problem should be solved

score 0 · Answer 13 · edited Sep 17 '20 at 15:40

i faced the same issue in react native .63 version. I tried above all methods but didn't worked. So, I tried like this deleted android/ios folders in my old project tree and initiated a new project with similar name in another folder, later copied android/ios folders from new project to old project and reset cache using react-native start --reset-cache and run react-native run-android and my attempt was successfull.

score 0 · Answer 14 · answered Nov 30 '20 at 02:42

UPDATE 2020. React Native 0.63.3 no longer support this command react-native eject. Also react-native upgrade responsible for - Upgrade your app's template files to the specified or latest npm version using rn-diff-purge project.

Available options can be found thought this command react-native --help

score 0 · Answer 15 · answered Aug 28 '21 at 21:49

0

As of end of August 2021 and react@17.0.2 / react-native@0.65.1 none of presented solutions work for me. expo-cli cannot work with modern react-native downgrading package.json and messing up all dependencies to a state where I cannot use neither react-native run-android nor expo run:android.

I have reported this issue on project GitHub. Feel free to comment and support for some reasonable solution in this area:

https://github.com/facebook/react-native/issues/32109

answered Aug 28 '21 at 21:49

CeDeROM

506
5
10

It worked for me but new project should have a exact same name compared to failed project. After that you can copy android / ios folders from new one to old one or copy old project app.js or other files to new one (works either way) but latter one is more successful. After copying remove lock files and run command yarn and then yarn start --reset-cache – srinivasa rao pedada Sep 13 '21 at 13:58

score 0 · Answer 16 · answered Mar 21 '22 at 15:37

0

1.Delete /ios /android

2.Cretate file app.json

And add code:

{"name": "example", "displayName": "Example"}

3.run npx react-native eject

4.run npx react-native run-android

answered Mar 21 '22 at 15:37

Trinh Hieu

379
3
6

score 0 · Answer 17 · answered Dec 24 '22 at 10:28

0

in my case I didn't have the android folder at all, I used expo init to create my react native project

and to generate Android Folder run this command expo prebuild

answered Dec 24 '22 at 10:28

Abdullah Belkaid

11
1

score 0 · Answer 18 · answered Jan 19 '23 at 09:37

0

npm i react-native-eject
npx react-native eject

(optional: to run ios App)

cd ios && pod install
npx react-native run-ios

answered Jan 19 '23 at 09:37

shiraz27

1,898
18
14

How can I regenerate ios folder in React Native project?

18 Answers18

Linked