Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/henninghall/react-native-date-picker/llms.txt

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

React Native Date Picker supports automatic linking for React Native 0.60 and above. In most cases, no manual linking is required.

​
Standard Installation

  1. Install the package:
# npm
npm install react-native-date-picker

# yarn
yarn add react-native-date-picker

# pnpm
pnpm add react-native-date-picker
  1. Install iOS dependencies (skip for Expo projects):
cd ios && pod install
  1. Rebuild your project:
# Non-Expo projects
npx react-native run-ios
npx react-native run-android

# Expo projects
npx expo run:ios
npx expo run:android

​
React Native < 0.60

For projects using React Native versions below 0.60, automatic linking is not available. You’ll need to link the package manually. 
npx react-native link react-native-date-picker
Then rebuild your project: 
npx react-native run-ios
npx react-native run-android

​
Manual Linking

If automatic linking fails or you’re experiencing issues, you can manually link the package.

​
iOS Manual Linking

  1. Open your project in Xcode (ios/YourProject.xcworkspace)
  2. In the project navigator, right-click on Libraries → Add Files to [Your Project]
  3. Navigate to node_modules/react-native-date-picker/ios and add RNDatePicker.xcodeproj
  4. In your project’s target, go to Build Phases → Link Binary With Libraries
  5. Add libRNDatePicker.a from the RNDatePicker.xcodeproj
  6. Clean and rebuild: 
    cd ios
rm -rf build
cd ..
npx react-native run-ios

​
Android Manual Linking

​
1. Update android/settings.gradle

Add the following: 
include ':react-native-date-picker'
project(':react-native-date-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-date-picker/android')

​
2. Update android/app/build.gradle

Add the dependency: 
dependencies {
    implementation project(':react-native-date-picker')
    // ... other dependencies
}

​
3. Update MainApplication.java

For React Native < 0.60, add the package to your application: 
import com.henninghall.date_picker.DatePickerPackage;

public class MainApplication extends Application implements ReactApplication {

  @Override
  protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
      new MainReactPackage(),
      new DatePickerPackage()  // Add this line
    );
  }
}

​
4. Rebuild

cd android
./gradlew clean
cd ..
npx react-native run-android

​
Troubleshooting

​
iOS Issues

​
”Library not found”

  1. Ensure pods are installed: 
    cd ios && pod install
  2. Clean the build folder: 
    cd ios
rm -rf build
xcodebuild clean
  3. Open Xcode and clean the build folder (Cmd + Shift + K)
  4. Rebuild: 
    npx react-native run-ios

​
“Module not found”

  1. Verify the package is in node_modules: 
    ls node_modules/react-native-date-picker
  2. Reinstall dependencies: 
    rm -rf node_modules
npm install  # or yarn install
cd ios && pod install
  3. Reset Metro bundler cache: 
    npx react-native start --reset-cache

​
Android Issues

​
”Could not resolve”

If you see dependency resolution errors:
  1. Sync Gradle files in Android Studio
  2. Clean the build: 
    cd android
./gradlew clean
  3. Rebuild: 
    npx react-native run-android

​
“Duplicate class found”

This may occur if the library is linked multiple times:
  1. For React Native >= 0.60, remove manual linking from settings.gradle and build.gradle
  2. Clean and rebuild: 
    cd android && ./gradlew clean
cd ..
npx react-native run-android

​
General Linking Issues

​
Verify Installation

Check that the package is properly installed: 
# Check package.json
cat package.json | grep react-native-date-picker

# Check node_modules
ls -la node_modules/react-native-date-picker

​
Clear All Caches

# Clear Metro bundler cache
npx react-native start --reset-cache

# Clear npm/yarn cache
npm cache clean --force
# or
yarn cache clean

# Reinstall dependencies
rm -rf node_modules
npm install  # or yarn install

​
Rebuild Everything

# iOS
cd ios
rm -rf build Pods Podfile.lock
pod install
cd ..
npx react-native run-ios

# Android
cd android
./gradlew clean
cd ..
npx react-native run-android

​
Verification

After linking, verify the package works by running this simple test: 
import DatePicker from 'react-native-date-picker'
import { View } from 'react-native'

const App = () => (
  <View>
    <DatePicker date={new Date()} onDateChange={() => {}} />
  </View>
)
If the component renders without errors, linking was successful.

​
Additional Resources