安卓arDebug构建下ViroReact AR物体渲染异常问题求助

Hey there! I’ve run into this exact issue with Viro React Native before—usually it boils down to resources not being properly bundled into your APK or missing config for the arDebug variant. Let’s walk through the fixes step by step:

1. Verify Resource Bundling Worked Correctly #

First, double-check that your bundle and assets were actually generated and placed in the right folders:

• After running react-native bundle, confirm android/app/src/main/assets/index.android.bundle exists.
• Check android/app/src/main/res/ for subfolders like drawable-* containing your AR assets (3D models, textures, etc.).
• If your models are stored locally, make sure they’re referenced using require('./path/to/model.glb') (not remote URLs) and that the path is correct in your code.

2. Fix Gradle Config for arDebug Variant #

Viro requires specific gradle setup to ensure assets are included in offline builds. Open android/app/build.gradle and make these adjustments:

• Ensure bundleInArDebug is enabled in your build types:

  buildTypes {
      arDebug {
          minifyEnabled false
          debuggable true
          bundleInArDebug true // This ensures JS bundle is included
      }
  }
  

• Add Viro's assets directory to your source sets (so its core resources are bundled):

  sourceSets {
      main {
          assets.srcDirs = ['src/main/assets', '../node_modules/react-native-viro/dist/js']
          jniLibs.srcDirs = ['libs']
      }
  }
  

3. Clean Cache and Rebuild from Scratch #

Cached build files often cause weird issues. Run these commands in order to start fresh:

# Clean React Native cache
npx react-native start --reset-cache

# Navigate to android folder
cd android

# Clean gradle cache
./gradlew clean

# Rebundle JS and assets
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

# Build the arDebug APK
./gradlew assemblearDebug

4. Check Android Manifest for AR Requirements #

Make sure your AndroidManifest.xml has all necessary permissions and ARCore config:

<!-- Required for AR -->
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera.ar" android:required="true" />

<!-- Inside <application> tag -->
<meta-data android:name="com.google.ar.core" android:value="required" />

This ensures the app can access the camera and properly initialize ARCore when offline.

5. Debug with Logcat to Find Exact Errors #

Even without USB connected during use, you can still capture logs after installing the APK:

1. Reconnect your device to USB
2. Run this command in terminal:

   adb logcat *:E
   

3. Open the app and try placing an object—look for errors like "failed to load model" or "asset not found". These logs will point you directly to the problem (e.g., a missing model file or incorrect path).

Final Notes #

Since you're new to React Native + AR, remember that offline builds behave differently than debug builds via USB—they don't have live reloading or asset hotloading, so every resource needs to be explicitly bundled. Most of the time, the issue is either missing gradle config or incorrect asset paths.

内容的提问来源于stack exchange，提问作者Omer