DEV Community

Cover image for A guide to Turbo Modules in React Native

A guide to Turbo Modules in React Native

Anisha Malde on July 18, 2023

As a React Native developer, I appreciate the flexibility that comes from the framework's cross-platform functionality. But, there are moments when...
Collapse
 
raguram90 profile image
RamR

useful article

Collapse
 
millisande_59 profile image
millisande

Really helpful!

Collapse
 
zhuliminl profile image
Saul

does Turbo Module support send event from native to JS ?

Collapse
 
mrsharma9867 profile image
Manish

Error: Unable to resolve module rtn-calculator/js/NativeCalculator from F:\TurboDemo\MyApp\App.tsx: rtn-calculator/js/NativeCalculator could not be found within the project or in these directories:
node_modules
8 | import {useState} from 'react';
9 | import {SafeAreaView, StatusBar, Text, Button} from 'react-native';

10 | import RTNCalculator from 'rtn-calculator/js/NativeCalculator';

Can somebody please help me out with this ? I have followed all the instruction properly.

Collapse
 
anishamalde profile image
Anisha Malde • Edited

Hey Manish,
Sometimes your node_modules get cached and the RTNCalculator wont have installed. I'd recommend deleting your node_module and running a yarn again!

Collapse
 
preetipantnagar profile image
preeti

Move it inside the app folder

Collapse
 
aldrin_tingson_3beecd2813 profile image
aldrin tingson

Hi.

I am stuck with ./gradlew generateCodegenArtifactsFromSchema

I am getting this error

Could not find com.android.tools.build:gradle

But i just copy-pasted the build.gradle here with the said dependency included.

Collapse
 
anishamalde profile image
Anisha Malde

Hey Aldrin,
Are you running the command from the DeviceName project folder?

Collapse
 
preetipantnagar profile image
preeti • Edited

I have cleared the cache run on different device deleted node modules and re-installed still getting error dev.to/amazonappdev/a-guide-to-tur...

: Error: Unable to resolve module rtn-device/js/NativeGetDeviceName from C:\Users\preetip\Projects\TurboModulesDemo\DeviceName\App.tsx: rtn-device/js/NativeGetDeviceName could not be found within the project or in these directories:
node_modules
27 |

Collapse
 
anishamalde profile image
Anisha Malde

Hey Preeti,
From the TMDemo folder ensure you are adding the TurboModule to your app by running:
yarn add ../RTNDeviceName

Collapse
 
preetipantnagar profile image
preeti

It worked as i moved it inside project

Thread Thread
 
anishamalde profile image
Anisha Malde

Ah yes, both projects need to be in the same folder.

Collapse
 
prathviraj_singhdodiya_0 profile image
Prathviraj Singh Dodiya

Hi Anisha,

As you mentioned about that it will only run on android app, so now we are unable to run the application on iOS because the current setup requires an interface for communication between iOS and React Native, which is not yet implemented. Currently, our solution is compatible solely with Android-specific modules (using Turbo Modules), which restricts functionality to Android applications. please correct me If I am wrong.

Is it possible to run the same app on IOS with android specific turbo modules?
Thankyou.

Collapse
 
anishamalde profile image
Anisha Malde

Hey yes, I just work on Android hence the focus on Android.

You need to create an IOS folder similar to the Android one. The React Native docs have an example: reactnative.dev/docs/native-module....