Hướng dẫn tích hợp Rust vào dự án React Native với Expo

Tạo dự án Expo

1. Tạo template Expo với tabs:

   npx create-expo-app --template tabs

2. Tạo native module:

   npx create-expo-module expo-settings

3. Xóa các file không cần thiết:

   cd modules/expo-settings
   rm ios/ExpoSettingsView.swift
   rm android/src/main/java/expo/modules/settings/ExpoSettingsView.kt
   rm src/ExpoSettingsView.tsx src/ExpoSettingsView.web.tsx src/ExpoSettingsModule.web.ts

4. Sửa các file còn lại để loại bỏ code thừa:

   • ExpoSettingsModule.kt
   • ExpoSettings.types.ts
   • ExpoSettingsModule.ts

5. Thêm file index.ts trong thư mục module để export các hàm cần thiết.

Tạo module Rust

1. Tạo module Rust:

   cd modules
   cargo new --lib rust-modules

2. Thêm các phụ thuộc cho Rust module trong Cargo.toml:

   [dependencies]
   jni = "0.21.0"
   
   [lib]
   crate-type = ["staticlib", "cdylib"]

3. Sửa file src/lib.rs trong module Rust để định nghĩa các hàm cần thiết.

Tích hợp trên iOS

1. Thêm target iOS:

   rustup target add aarch64-apple-ios aarch64-apple-ios-sim

2. Biên dịch mã Rust cho iOS:

   cargo build --release --target aarch64-apple-ios
   cargo build --release --target aarch64-apple-ios-sim

3. Copy file librust_modules.a vào thư mục:

   modules/expo-settings/ios/rust
   

4. Cài đặt cbindgen để tạo file header C:

   cargo install cbindgen
   cbindgen --lang c --crate rust-modules --output rust-modules.h

   Copy file rust-modules.h vào thư mục modules/expo-settings/ios/rust.

5. Thêm đường dẫn thư viện vào ExpoSettings.podspec:

   s.vendored_libraries = "rust/librust_modules.a"

6. Thêm hàm vào NativeModule.swift:

   Function("rustAdd") { (a: Int32, b: Int32) -> Int32 in
       return rust_add(a, b)
   }

7. Cài đặt dependencies và build lại dự án:

   pod install --project-directory=ios

Tích hợp trên Android

1. Biên dịch mã Rust cho các kiến trúc Android:

   cargo ndk --target aarch64-linux-android --platform 31 build --release
   cargo ndk --target armv7-linux-androideabi --platform 31 build --release
   cargo ndk --target x86_64-linux-android --platform 31 build --release
   cargo ndk --target i686-linux-android --platform 31 build --release

2. Tạo thư mục jniLibs và các thư mục con:

   modules/expo-settings/android/src/main/jniLibs/
   ├── arm64-v8a
   ├── armeabi-v7a
   ├── x86_64
   └── x86
   

3. Copy file .so vào các thư mục tương ứng:

   arm64-v8a -> librust_modules.so
   armeabi-v7a -> librust_modules.so
   x86_64 -> librust_modules.so
   x86 -> librust_modules.so
   

4. Thêm đoạn code nạp thư viện Rust trong ExpoSettingsModule.kt:

   companion object {
       init {
           System.loadLibrary("rust_modules")
       }
   }

   Lưu ý: Tên trong System.loadLibrary phải khớp với tên file .so. Nếu file .so có tên librust_modules.so, hãy sử dụng System.loadLibrary("rust_modules").

5. Thêm khai báo hàm native:

   external fun rust_add(a: Int, b: Int): Int

6. Thêm hàm trung gian để React Native có thể gọi:

   Function("rust_add") { a: Int, b: Int ->
       rust_add(a, b)
   }

7. Build lại dự án (cần development build hoặc eject):

   yarn android

Ghi chú

• Đảm bảo tên module trong Cargo.toml khớp với tên thư viện được nạp trên Android và iOS.
• Nếu gặp lỗi, kiểm tra logcat (Android) hoặc Xcode logs (iOS) để debug.