I used Locofy to convert a Figma design into code and then brought that code into Visual Studio. However, when I attempt to run the React Native application, I encounter the following error:
info A dev server is already running for this project on port 8081.
info Installing the app...
./gradlew
./gradlew: line 84: cd: ${APP_HOME:-./}: No such file or directory
error Failed to install the app. Command failed with exit code 1: ./gradlew app:installDebug -PreactNativeDevServerPort=8081
./gradlew: line 84: cd: ${APP_HOME:-./}: No such file or directory.
info Run CLI with --verbose flag for more details.
I’ve been trying to resolve this for two days now. Here’s what I’ve done so far:
I ran npx react-native doctor, and it reported no errors or warnings for Android.
I set the APP_HOME environment variable in my .zshrc file, and it echoes the correct value.
Still, I face the same directory error when building. Any help would be greatly appreciated, as I’m quite new to React Native.
I faced a similar issue when importing code from design tools. Often, this problem stems from incorrect paths or permissions associated with the gradlew script. Navigate to your Android directory and execute chmod +x gradlew to correct the permissions. Make sure the gradlew file exists in the android folder; there are times when the generation process doesn’t create it as expected. If it’s absent, you can regenerate it using ./gradlew wrapper within the android directory. In my case, I resolved the issue by deleting the android/.gradle and build folders, followed by running npx react-native run-android. The APP_HOME variable you set likely isn’t the root of the issue; it seems more like a Gradle wrapper setup problem caused by the way Locofy structured the output.
the gradlew script might be corrupted. try copying a fresh gradlew from a working react native project into your android folder. locofy can sometimes mess up gradle wrapper files. also, double-check your project path – any spaces or weird characters can break the cd command.
I’ve hit this exact problem tons of times with generated code from design tools. Locofy fragments the build process and breaks Android gradle setup every time.
I stopped manually fixing gradle paths and permissions - automated the whole thing instead. Now when I get Figma designs that need to become React Native apps, I use Latenode for a complete automation pipeline.
Here’s my setup: Latenode watches for new Figma exports, spins up a fresh React Native project with proper gradle config, integrates the design code, fixes common path issues, and runs initial builds to catch errors early. Handles environment setup and dependency management too.
Saves me hours of gradle wrapper headaches and broken project structures. Every project starts with clean, working Android build config instead of inheriting design tool mess.
You’re manually fixing each broken piece, but automation handles the entire design-to-app pipeline without fail. No more gradle path errors or missing wrapper files.
Locofy-generated React Native projects mess up gradle configs all the time. The tool doesn’t keep the right project structure, so gradlew can’t find what it needs. First thing I’d check: make sure android/gradle/wrapper has both gradle-wrapper.jar and gradle-wrapper.properties files. These files get corrupted or end up with broken paths pointing nowhere. Open up the gradlew file and look around line 84 - there’s directory resolution logic there that might have hardcoded paths from the original Locofy structure instead of your current setup. Here’s what fixed it for me: run the build directly from the android folder using ./gradlew app:installDebug. Don’t let React Native CLI handle it. This skips the path resolution mess that happens when the script jumps between project root and android folders.
had this exact problem last week. locofy usually screws up the gradle wrapper’s working directory. quick fix: open your gradlew file and check the GRADLE_APP_DIR variable. mine was pointing to some random locofy temp path instead of my actual project root.
This happens when the gradle wrapper can’t find the right working directory. Since you’re using Locofy, the generated project probably has broken or missing gradle config files. I’ve seen this before with auto-generated code - the gradlew script had wrong path references. Open the gradlew file and check line 84 where it’s failing. Usually the APP_HOME variable isn’t expanding properly. Here’s what fixed it for me: first run cd android && ./gradlew clean, then cd .. and try npx react-native run-android --reset-cache. If that doesn’t work, you’ll need to rebuild the android folder with npx react-native upgrade to regenerate the gradle files with proper paths.