The incompatibility of Node v12 and React-native(android SDK setup)

At the time of writing this article, node v10 is the node long term support(LTS) version while the latest version v12 which had been released is still under refinement.

N/B: This article is based on the Linux Ubuntu 18.04 OS.

The bumpy road to React-native

At learnFactory Nigeria’s 2019 cohorts 2 internship, React-native was demystified. Mr Ugwuanyi Chidera of learnFactory tutored the interns on this amazing toolkit. In the course of this mission, the node v12 and react native’s incompatibility came to play.

So, after the react-native introductory class, we interns were guided to install React-native’s core and dependencies on our local machines, as well as syncing with our mobile devices to enable the React-native core on our local machines download and install the development app to our mobile device(You can refer to my previous article on setting up react native with android SDK).

On successful completion of the above, running the 'npm start' command on the just created react native app directory/folder starts the app simultaneously on the local machine and mobile device.

This process was successfully replicated by all the interns albeit some interns computer did freeze whenever the 'npm start' command was run. It happened that running the ‘npm start’ command exhausted their system’s RAM.

After days of painstaking debugging and research, it was discovered that the interns having this challenge had the latest node v12 whilst others had the node v10 LTS.

debugging

Further research on this situation indicted the node V12 for this bug. Apparently, many v12 users have faced similar challenge.

Removing node v12 and downgrading to node LTS

This task was herculean because removing node v12 through the command line proved futile.

I tried to remove the node v12 with the :

sudo apt-get purge nodejs

command.

Then, I used the :

node -v 

command to confirm if it was successfully removed. It was!

So I installed the node LTS version and confirmed again. After this, I tried re-starting React-native alas the problem re-occurred; RAM still got exhausted and froze LM.

I had to reboot the system and then checked the node version yet again. It had mysteriously reverted to node v12. Oops!!!

I had to repeat the striping process multiple times and got same disappointing result.

Which way?

Eureka!

I was on a different task when I stumbled upon the 'node modules' folder in the 'home' directory of my local machine. Like Archimedes, an idea struck me.

Earlier on, during the React-native installation, we manually installed the Android SDK to our home directory and set up its accessibility path in the '.bashrc' file.

Apparently, folders in the home directory can be assessed globally within the local machine through their set paths in the .bashrc shell script.

How to successfully remove the node modules/node v12

• Delete the node modules folder therein the ‘home’ folder.
• Then, open your default terminal and run:

 gedit $HOME/.bashrc 

to open the .bashrc file.

• In the opened .bashrc, delete the ‘nvm’ path that looks like so:

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

Downgrading to LTS

Right about now, download the node and npm LTS(check for the LTS here) with the following commands:

sudo apt-get install curl
curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
sudo apt-get install nodejs

Viola! You can now proceed with your React native setup. Happy hacking!!!

P.S. So folks, always stick with the LTS versions of your desired technologies.

…..Gracias learnFactory