Basic Commands Explained React Native - Examples

 

Starting a new project

There are different ways you can bootstrap a react native application. You can use Expo or create-react-native-app(which in turns uses Expo-Cli) to start your new project, but with this method you are in more control of what happend in your projecto and can communicate, tweak and write your own modules with native libraries for iOS and Android mobile platform.

react-native init [PROJECT-NAME]
cd [PROJECT-NAME]

Run app in Android emulator

This command is self explanatory and as it says it will start the Android emulator and install the app you just created. You need to be in the root of the project to run this command.

react-native run-android

Run app in iOS emulator

This command do exactly the same as react-native run-android but instead of the Android emulator, it opens the iPhone simulator.

react-native run-ios

Link dependencies to native projects

Some libraries have dependencies that need to be linked in the native code generated for React Native. If something doesn’t work after you installed a new library, maybe is because you skip this step.

react-native link [LIBRARY-NAME]

Clear bundle

If something don’t run as expected, maybe you need to clear and create a new bundle with this command.

watchman watch-del-all

Support decorators

JSX doesn’t support decorators by default so you need to install the Babel plugin to make it work.

npm install babel-plugin-transform-decorators-legacy --save
npm install babel-plugin-transform-class-properties --save

Export APK to run in device

With the following commands you will have and unsigned apk so you can install and share with your colleagues for testing purposes. Just remember that this apk is not ready to upload to the App Store or production. You will find your fresh apk in android/app/build/outputs/apk/app-debug.apk.

1. Bundle debug build

react-native bundle --dev false --platform android --entry-file index.android.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug

2. Create debug build

cd android
./gradlew assembleDebug

Create React Native Project
           react-native init projectName
Run React-Native Project
           react-native run-android
             react-native run-ios
Create React-Native Module
    npm install -g react-native-create-library
    react-native-create-library your_library_name
          cd myLibrary
          npm install
Clean build cache
Note:- android and ios both platform
     cd android && ./gradlew clean && cd .. && cd ios && xcodebuild clean && cd  ..
Install/Uninstall a package from npm
      npm install  your_library_name
      npm uninstall  your_library_name
Link/Unlink a package to react-native app
    react-native link your_library_name
    react-native unlink your_library_name
Recreate android and ios folder.
   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:
 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
Npm-cli-login
 npm install -g npm-cli-login
 npm-cli-login -u testUser -p testPass -e test@example.com
npm login (after successful login)
npm publish
Clean cache and node modules and temp memory (for windows)
 del %appdata%\Temp\react-native-* & cd android & gradlew clean & cd  .. & del node_modules/ & npm cache clean --force & npm install & npm   start -- --reset-cache