Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/BhushanBadhe39/SkinFirts/llms.txt

Use this file to discover all available pages before exploring further.

This page covers the most frequently encountered problems when setting up, building, and running SkinFirts, along with step-by-step resolutions. Issues are grouped by the stage at which they appear — bundler, native build, runtime, and API. If your issue is not listed here, consult the React Native troubleshooting guide linked at the bottom of this page.
Metro may fail to start if the cache is stale or corrupted, particularly after upgrading a dependency or switching branches.Fix: Clear the Metro cache and restart:
npm start -- --reset-cache
If the problem persists, also remove the Watchman cache:
watchman watch-del-all
npm start -- --reset-cache
React Native libraries that include native iOS code (Objective-C or Swift modules) must be linked via CocoaPods. Forgetting to re-run CocoaPods after npm install is the most common cause of iOS build failures after adding a dependency.Fix: Install CocoaPods dependencies from the project root, then rebuild:
bundle exec pod install
npm run ios
If this is your first time cloning the project, run bundle install first to install the correct CocoaPods version:
bundle install
bundle exec pod install
The Android toolchain requires a compatible Java Development Kit and Android SDK. Common error messages include JAVA_HOME is not set, SDK location not found, or Gradle version conflicts.Fix:
1

Install Java 17+

Download and install Java 17 or later. Set the JAVA_HOME environment variable to point to the JDK installation directory.
# Example on macOS with Homebrew
export JAVA_HOME=$(/usr/libexec/java_home -v 17)
2

Install Android SDK via Android Studio

Open Android Studio → SDK Manager and install the Android SDK platform matching the targetSdkVersion in android/build.gradle. Ensure the ANDROID_HOME environment variable is also set.
3

Rebuild

npm run android
This error means Metro cannot locate a JavaScript module. It usually happens after a dependency installation goes wrong, the node_modules folder is out of sync, or the Metro cache refers to old paths.Fix: Perform a full clean and reinstall:
rm -rf node_modules
npm install
npm start -- --reset-cache
On iOS, also reinstall CocoaPods dependencies after npm install:
bundle exec pod install
The app fetches doctor data from a MockAPI endpoint defined in src/api/Client.js. Loading failures are typically caused by network issues, an unreachable MockAPI URL, or a request timeout.Checks to perform:
  • Confirm your device or simulator has network connectivity.
  • Verify that the baseURL in src/api/Client.js (https://6a63416d1bffb2ffab8bf093.mockapi.io) is reachable from your machine by opening it in a browser.
  • The apiClient has a timeout of 10 seconds (10000 ms). If MockAPI is slow to respond, the request is aborted and an error is thrown. Try again once MockAPI is responsive.
  • Check that the doctorData resource exists and contains records in the MockAPI dashboard.
src/api/Client.js (excerpt)
export const apiClient = axios.create({
    baseURL: 'https://6a63416d1bffb2ffab8bf093.mockapi.io',
    timeout: 10000
});
loginUser in authService.js matches credentials against the full users list fetched from MockAPI. Login will always return false if the credentials or the backend data don’t line up.Checks to perform:
  • Confirm the test account exists in the MockAPI users resource dashboard.
  • The email comparison is case-insensitive and trimmed — " User@Example.com " will match "user@example.com".
  • The password comparison is exact match (===) — there is no client-side hashing. Make sure the value stored in MockAPI is identical to what the login form submits.
  • If you recently created the account with signUpUser, confirm the POST succeeded and the new record appears in MockAPI.
SVG files are only usable as React components if the Metro SVG transformer is correctly configured and the file is imported as a default import.Checks to perform:
  1. Confirm metro.config.js contains the SVG transformer configuration:
metro.config.js (excerpt)
transformer: {
  babelTransformerPath: require.resolve('react-native-svg-transformer'),
},
resolver: {
  assetExts: assetExts.filter(ext => ext !== 'svg'),
  sourceExts: [...sourceExts, 'svg'],
},
  1. Import the SVG as a default import (not a named import):
// ✅ Correct
import Logo from '../assets/icons/Logo.svg';
<Logo width={40} height={40} />

// ❌ Incorrect — SVGs have no named exports
import { Logo } from '../assets/icons/Logo.svg';
  1. Restart Metro with --reset-cache after any change to metro.config.js.
Fast Refresh automatically updates the running app when you save a source file. If changes are not reflected in the running app, try a manual reload.
  • Android emulator / device: Press R twice, or open the Dev Menu with Ctrl + M (Windows/Linux) or Cmd ⌘ + M (macOS) and tap Reload.
  • iOS Simulator: Press R while the Simulator window is focused.
If Fast Refresh continues to be unreliable, stop Metro, clear the cache, and restart:
npm start -- --reset-cache
Running pod install directly (without bundle exec) uses whatever version of CocoaPods is installed globally, which may differ from the version pinned for this project. Version mismatches can cause unexpected pod resolution failures.Fix: Always use the Bundler-managed CocoaPods version:
# Install the correct CocoaPods version (first time only)
bundle install

# Use bundled CocoaPods for all pod operations
bundle exec pod install
If a user appears to remain logged in after tapping the logout button, the most likely cause is that logoutUser was not awaited before the navigation reset fired.logoutUser is async and calls AsyncStorage.removeItem internally. If the navigation reset triggers synchronously before the removeItem promise settles, the new screen may read the stale @user_account_details key before it is deleted.Fix: Always await logoutUser before resetting navigation:
// ✅ Correct — await ensures storage is cleared before navigation
const handleLogout = async () => {
  await logoutUser(dispatch);
  navigation.reset({ index: 0, routes: [{ name: 'Login' }] });
};

// ❌ Incorrect — navigation may run before AsyncStorage.removeItem finishes
const handleLogout = () => {
  logoutUser(dispatch);
  navigation.reset({ index: 0, routes: [{ name: 'Login' }] });
};
For issues not covered above — such as environment setup, native debugging, or platform-specific build errors — see the official React Native Troubleshooting page.

Build docs developers (and LLMs) love

Get started for freeTalk to us