vibes-react-native-expo
v0.3.23
Published
Expo module for Vibes Android & iOS SDK integration
Readme
Vibes SDK - Android & iOS Installation Guide (Managed Workflow + Custom Development Build)
This guide provides step-by-step instructions for installing and configuring the Vibes SDK in your Android & iOS React Native/Expo application using managed workflow with custom development build and Expo 51.
Applicable for Android only: The Vibes SDK for Android is distributed as an AAR (Android Archive) file, which is a binary library format that contains compiled Android code, resources, and manifest entries. AAR files are automatically included in your app during the build process through the Expo plugin system.
Why AAR files don't require credentials:
- AAR files are pre-compiled libraries that contain the Vibes SDK's native Android code
- They are stateless - they don't store any credentials or sensitive information
- Authentication and configuration are handled at runtime through your app's configuration (via
androidAppIdandappUrlparameters) - The AAR file only provides the native interface - actual API calls and authentication happen when your app runs and connects to Vibes servers using your configured credentials
Prerequisites
Before you begin, ensure you have the following:
- Expo CLI installed globally:
npm install -g @expo/cli - EAS CLI installed:
npm install -g eas-cli - React Native
npm install [email protected] - Firebase
npm install @react-native-firebase/app @react-native-firebase/messaging - Expo account (free or paid tier at expo.dev)
- Node.js and npm or yarn
- Java Development Kit (JDK) 11 or higher
- Android SDK with API level 21+ (Android 5.0+)
Installation Steps
1. Install the Package
Add the Vibes SDK package to your project dependencies:
npm install vibes-react-native-expo
# or
yarn add vibes-react-native-expoIf you continue to encounter errors while installing the Vibes SDK, you can install it using the --legacy-peer-deps flag to ensure the Expo dependencies compatibility and the SDK is installed correctly
npm install vibes-react-native-expo --legacy-peer-deps2. Configure the Plugin
Add the Vibes plugin configuration to your app.config.ts file:
import { ExpoConfig } from "expo/config";
export default {
expo: {
// ... other expo config
plugins: [
[
"vibes-react-native-expo",
{
androidAppId: process.env.ANDROID_APP_ID,
appUrl: process.env.APP_URL,
iosAppId: process.env.IOS_APP_ID,
vibesAppEnv: process.env.VIBES_APP_ENV || "UAT",
apsEnvironment: process.env.APP_ENV || "development", // or "production"
},
],
],
ios: {
bundleIdentifier: "com.yourcompany.yourapp",
entitlements: {
"aps-environment": "development"
}
},
android: {
package: "com.yourcompany.yourapp",
// ... other android config
},
},
};3. Environment Variables
In app.config.ts, you can reference environment variables directly using process.env.ANDROID_APP_ID, process.env.APP_URL, process.env.IOS_APP_ID, and process.env.VIBES_APP_ENV (no EXPO_PUBLIC_ prefix needed), because the config is loaded at build time, not at runtime.
Create a .env file in your project root and add your Vibes credentials:
ANDROID_APP_ID=your-android-app-id-here
IOS_APP_ID=your-ios-app-id-here
APP_URL=https://your-vibes-api-url.com/mobile_apps
VIBES_APP_ENV=UAT
APP_ENV=developmentThen update your app.config.ts:
export default {
expo: {
plugins: [
[
"vibes-react-native-expo",
{
androidAppId: process.env.ANDROID_APP_ID,
appUrl: process.env.APP_URL,
iosAppId: process.env.IOS_APP_ID,
vibesAppEnv: process.env.VIBES_APP_ENV || "UAT",
apsEnvironment: process.env.APP_ENV || "development", // or "production"
},
],
],
},
};Setting Environment Variables for EAS Cloud Build
For EAS Cloud Build:
- Set environment variables in the
envsection of youreas.jsonfile, referencing secrets using$ANDROID_APP_ID,$IOS_APP_ID,$APP_URL, and$VIBES_APP_ENV(recommended and most secure). - Set secrets using the
eas secret:createcommand. - Do not rely on local
.envfiles for cloud builds – they are ignored by EAS Cloud Build.
Setting EAS Secrets
Set secrets in Expo/EAS Cloud:
eas secret:create --name ANDROID_APP_ID --value your-android-app-id
eas secret:create --name IOS_APP_ID --value your-ios-app-id
eas secret:create --name APP_URL --value https://your-api-url.com/mobile_apps
eas secret:create --name VIBES_APP_ENV --value UAT # or PROD
eas secret:create --name APP_ENV --value development # or "production"Best practice: Always test your cloud build to ensure variables are passed correctly to your plugin and app config.
4. Configure EAS Build
Create or update your eas.json file to include development builds:
{
"cli": {
"version": ">= 5.9.1"
},
"build": {
"development": {
"developmentClient": true,
"distribution": "internal",
"android": {
"gradleCommand": ":app:assembleDebug"
},
"ios": {
"buildConfiguration": "Debug",
//In case you're having eas build cache issue - add these two
"credentialsSource": "remote",
"cache": {
"key": "pods-ios-{{ hash }}"
}
},
"env": {
"ANDROID_APP_ID": "$ANDROID_APP_ID",
"IOS_APP_ID": "$IOS_APP_ID",
"APP_URL": "$APP_URL",
"VIBES_APP_ENV": "$VIBES_APP_ENV",
"APP_ENV": "$APP_ENV"
}
},
"preview": {
"distribution": "internal",
"android": {
"buildType": "apk"
},
"ios": {
"buildConfiguration": "Release"
},
"env": {
"ANDROID_APP_ID": "$ANDROID_APP_ID",
"IOS_APP_ID": "$IOS_APP_ID",
"APP_URL": "$APP_URL",
"VIBES_APP_ENV": "$VIBES_APP_ENV",
"APP_ENV": "$APP_ENV"
}
},
"production": {
"android": {
"buildType": "aab"
},
"ios": {
"buildConfiguration": "Release"
},
"env": {
"ANDROID_APP_ID": "$ANDROID_APP_ID",
"IOS_APP_ID": "$IOS_APP_ID",
"APP_URL": "$APP_URL",
"VIBES_APP_ENV": "$VIBES_APP_ENV",
"APP_ENV": "$APP_ENV"
}
}
},
"submit": {
"production": {}
}
}5. Create Development Build
Build a custom development client that includes the Vibes SDK:
# For cloud build (recommended)
eas build --profile development --platform android
# For iOS development build
eas build --profile development --platform iosThis will:
- Create a custom development client with Vibes SDK included
- Apply the plugin configuration automatically
- Generate an APK file (Android) or IPA file (iOS) you can install on your device
Android Configuration Details
Automatic Configuration
The plugin automatically configures the native Android files during the EAS build process. You don't need to manually edit these files:
AndroidManifest.xml
The plugin automatically adds these permissions and metadata:
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.VIBRATE"/>
<!-- ... other permissions -->
<application>
<meta-data android:name="vibes_app_id" android:value="${vibesAppId}"/>
<meta-data android:name="vibes_api_url" android:value="${vibesAppUrl}"/>
<!-- ... other metadata -->
</application>build.gradle
The plugin automatically adds manifest placeholders:
android {
defaultConfig {
manifestPlaceholders = [
vibesAppId: "your-app-id",
vibesAppUrl: "your-api-url"
]
}
}iOS Configuration Details
Automatic Configuration
The plugin automatically configures the native iOS files during the EAS build process:
Info.plist
The plugin automatically adds these keys:
<key>VibesAppId</key>
<string>$(VIBES_APP_ID)</string>
<key>VibesApiURL</key>
<string>$(VIBES_API_URL)</string>
<key>VibesAppEnv</key>
<string>$(VIBES_APP_ENV)</string>
<key>NSPushNotificationsUsageDescription</key>
<string>This app uses push notifications to keep you updated.</string>
<key>UIBackgroundModes</key>
<array>
<string>remote-notification</string>
</array>AppDelegate.mm
The plugin automatically creates and configures AppDelegate.mm with Vibes SDK initialization and push notification handling.
VibesBridge Files
The plugin automatically creates:
VibesBridge.h- Header file for native bridgeVibesBridge.m- Implementation file for native bridge with push notification setup
Push Notifications
The plugin automatically adds:
- Push notification permissions (
NSPushNotificationsUsageDescription) - Background modes for remote notifications (
UIBackgroundModes) - Entitlements for push notifications (
aps-environment) - Automatic push token handling in AppDelegate.mm
Development Workflow
- Install the development build on your device using QR code
- Start the development server:
npx expo start --dev-client - Open the app on your device - it will connect to your development server
Minimum Requirements
Android
- Android API Level: 21+ (Android 5.0 Lollipop)
- Target SDK: 34 (Android 14)
- Compile SDK: 34
- Gradle Version: 7.0+
iOS
- iOS Version: 13.0+
- Xcode Version: 15.0+
- Swift Version: 5.0+
- Push Notifications: Must be configured in Apple Developer Portal
- Entitlements:
aps-environmentmust be set todevelopmentorproduction
Verification
After installation, verify the setup by checking:
- Plugin Configuration: Ensure the plugin is listed in your
app.config.ts - Development Build: Successfully create and install the development build
- App Connection: Verify the app connects to your development server
- Vibes Integration: Test that Vibes SDK functions work in your app
Warnings
These warnings are not blockers for a successful build. The warnings you see are from React Native and Expo dependencies.
Important Notes
- SDK Compatibility: This SDK automatically adapts to your app's Expo and React Native versions
- Warning Source: Warnings come from React Native/Expo dependencies, not from this SDK
- Resolution: Most warnings disappear when you update React Native and Expo to newer versions
How to Suppress Warnings
To suppress the remaining warnings, add the following overrides section to your app's package.json:
{
"overrides": {
"@xmldom/xmldom": "^0.8.10",
"rimraf": "^4.4.1",
"glob": "^9.3.5"
}
}Legacy Packages (from React Native/Expo)
These packages are used by React Native and Expo dependencies:
| Package | Reason | |---------|--------| | [email protected] | Leaks memory; no longer supported | | [email protected] | Deprecated, no active support | | [email protected] | Deprecated tool for elevated permissions | | @babel/plugin-proposal-* | These were used when the JS features were still experimental. Since the features are now part of the ECMAScript standard, transform plugins are preferred. | | [email protected] | Old version |
Why This Happens
These packages are pulled in by React Native and Expo during the standard build process. They are not part of this SDK.
Common Warnings
npm warn deprecated [email protected]: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm warn deprecated [email protected]: Glob versions prior to v9 are no longer supported
npm warn deprecated [email protected]: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
npm warn deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
npm warn deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm warn deprecated [email protected]: This package is no longer supported.
npm warn deprecated @xmldom/[email protected]: this version is no longer supported, please update to at least 0.8.*
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-catch-binding instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-numeric-separator instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-logical-assignment-operators instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-object-rest-spread instead.
npm warn deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-async-generator-functions instead.
npm warn deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
npm warn deprecated [email protected]: Glob versions prior to v9 are no longer supported
npm warn deprecated [email protected]: Glob versions prior to v9 are no longer supported
npm warn deprecated [email protected]: Glob versions prior to v9 are no longer supportedTroubleshooting
Common Issues
1. Build Errors
If you encounter EAS build errors:
# Check build logs
eas build:list
# Retry the build
eas build --profile development --platform android --clear-cache
# For iOS
eas build --profile development --platform ios --clear-cache
#### 2. Development Client Issues
If the development client doesn't work:
```bash
# Rebuild the development client
eas build --profile development --platform android
# Clear Expo cache
npx expo start --clear
# Check device connection
npx expo start --dev-client --tunnel3. Plugin Not Applied
If the Vibes plugin isn't working:
# Verify plugin configuration in app.config.ts
# Rebuild the development client
eas build --profile development --platform android --clear-cache
# For iOS
eas build --profile development --platform ios --clear-cache4. iOS Push Notification Issues
If push notifications aren't working on iOS:
# Verify entitlements are set correctly
# Check that aps-environment is set to "development" or "production"
# Ensure push notifications are enabled in Apple Developer Portal
# Verify APNs certificate/key is configured correctlyDebug Steps
- Check EAS build logs for any configuration errors
- Verify plugin configuration in your
app.config.ts - Ensure environment variables are properly set
- Test development client connection to your development server
- Check Vibes SDK initialization in your app code
Next Steps
After successful installation:
- Test the development build - Install the APK on your device and verify it connects to your development server
- Initialize Vibes SDK in your app code using the examples in the Usage Guide below
- Configure your Vibes dashboard - Set up your app in the Vibes platform and get your credentials
- Configure iOS Push Notifications - Set up push notifications in Apple Developer Portal:
- Create an APNs certificate or key
- Configure your app's bundle identifier
- Enable push notifications capability
- Test basic functionality - Register device, associate user, and test push notifications
- Create production build when ready to deploy:
eas build --profile production --platform androidoreas build --profile production --platform ios
Usage Guide
The Vibes SDK provides a simple interface for integrating push notifications and messaging features into your React Native app. After installation, you can import the required functions and start using the SDK immediately.
The main functions you'll use are:
registerDevice()- Register the device with VibesregisterPush()- Enable push notificationsassociatePerson()- Link a user to the devicegetPerson()- Get current user informationfetchInboxMessages()- Retrieve inbox messages
Importing the SDK
// Import the entire module
import ExpoVibesSDK from 'vibes-react-native-expo';Basic Setup and Initialization
Important: The registerDevice() and registerPush() functions return Promises that resolve when the registration is complete.
You must ensure registerDevice() completes before calling registerPush() by using .then() chains or await.
A correct implementation should be based on events/callbacks. For example:
import { useEffect } from 'react';
import ExpoVibesSDK from 'vibes-react-native-expo';
useEffect(() => {
// Example: listening to onChange event
const subscription = ExpoVibesSDK.addListener('onChange', (event) => {
console.log('Value changed:', event.value);
});
// Example: registering device and handling event
ExpoVibesSDK.registerDevice().then((deviceId) => {
console.log('Device registered:', deviceId);
// Register push after device registration completes
return ExpoVibesSDK.registerPush();
}).then((result) => {
console.log('Push registered:', result);
});
// Example: listening to onGetPerson event
const personSub = ExpoVibesSDK.addListener('onGetPerson', (event) => {
console.log('Person event:', event.person);
});
// Example: listening to onFetchInboxMessages event
const inboxSub = ExpoVibesSDK.addListener('onFetchInboxMessages', (event) => {
console.log('Inbox messages event:', event.messages);
});
// Cleaning up subscriptions on unmount
return () => {
subscription.remove();
personSub.remove();
inboxSub.remove();
};
}, []);User Management
import ExpoVibesSDK from 'vibes-react-native-expo';
// Associate a user with the device
const associateUser = async (userId: string) => {
try {
await ExpoVibesSDK.associatePerson(userId);
console.log('User associated successfully');
} catch (error) {
console.error('Failed to associate user:', error);
}
};
// Get current user information
const getCurrentUser = async () => {
try {
const person = await ExpoVibesSDK.getPerson();
console.log('Current user:', person);
return person;
} catch (error) {
console.error('Failed to get user:', error);
return null;
}
};Inbox Messages
import ExpoVibesSDK from 'vibes-react-native-expo';
// Fetch all inbox messages
const loadInboxMessages = async () => {
try {
const messages = await ExpoVibesSDK.fetchInboxMessages();
console.log('Inbox messages:', messages);
return messages;
} catch (error) {
console.error('Failed to fetch messages:', error);
return [];
}
};
// Fetch specific message
const loadMessage = async (messageId: string) => {
try {
const message = await ExpoVibesSDK.fetchInboxMessage(messageId);
console.log('Message details:', message);
return message;
} catch (error) {
console.error('Failed to fetch message:', error);
return null;
}
};
// Mark message as read
const markAsRead = async (messageId: string) => {
try {
await ExpoVibesSDK.markInboxMessageAsRead(messageId);
console.log('Message marked as read');
} catch (error) {
console.error('Failed to mark message as read:', error);
}
};
// Expire message
const expireMessage = async (messageId: string) => {
try {
await ExpoVibesSDK.expireInboxMessage(messageId);
console.log('Message expired');
} catch (error) {
console.error('Failed to expire message:', error);
}
};Device Updates
import ExpoVibesSDK from 'vibes-react-native-expo';
// Update device location and credentials
const updateDeviceInfo = async (latitude: number, longitude: number) => {
try {
await ExpoVibesSDK.updateDevice(true, latitude, longitude);
console.log('Device updated successfully');
} catch (error) {
console.error('Failed to update device:', error);
}
};Notification Events (Deep linking)
import {NativeEventEmitter, NativeModules, DeviceEventEmitter } from 'react-native';
const onPushReceived = (event) => {
console.log('Push received', event.payload)
};
const onPushOpened = async (event) => {
console.log('Push opened', event.payload)
};
const addEventListeners = () => {
const eventEmitter = Platform.OS === 'ios' ? new NativeEventEmitter(NativeModules.VibesPushEmitter) : DeviceEventEmitter;
eventEmitter.addListener('pushReceived', onPushReceived);
eventEmitter.addListener('pushOpened', onPushOpened);
}Complete Example App
import React, { useEffect, useState } from 'react';
import { View, Text, Button, Alert, ScrollView, NativeEventEmitter, NativeModules, DeviceEventEmitter } from 'react-native';
import ExpoVibesSDK from 'vibes-react-native-expo';
export default function VibesExampleApp() {
const [user, setUser] = useState<string | null>(null);
const [messages, setMessages] = useState<any[]>([]);
const onPushReceived = (event) => {
console.log('Push received', event.payload)
};
const onPushOpened = async (event) => {
console.log('Push opened', event.payload)
};
const addEventListeners = () => {
const eventEmitter = Platform.OS === 'ios' ? new NativeEventEmitter(NativeModules.VibesPushEmitter) : DeviceEventEmitter;
eventEmitter.addListener('pushReceived', onPushReceived);
eventEmitter.addListener('pushOpened', onPushOpened);
}
useEffect(() => {
initializeVibes();
addEventListeners()
}, []);
const initializeVibes = async () => {
try {
// Register device first (required before push registration)
await ExpoVibesSDK.registerDevice();
// Register push notifications (will wait for device registration to complete)
await ExpoVibesSDK.registerPush();
Alert.alert('Success', 'Vibes SDK initialized!');
} catch (error) {
Alert.alert('Error', 'Failed to initialize Vibes SDK');
}
};
const handleLogin = async () => {
try {
await ExpoVibesSDK.associatePerson('user123');
const currentUser = await ExpoVibesSDK.getPerson();
setUser(currentUser);
Alert.alert('Success', 'User logged in!');
} catch (error) {
Alert.alert('Error', 'Login failed');
}
};
const loadMessages = async () => {
try {
const inboxMessages = await ExpoVibesSDK.fetchInboxMessages();
setMessages(inboxMessages);
} catch (error) {
Alert.alert('Error', 'Failed to load messages');
}
};
const markMessageRead = async (messageId: string) => {
try {
await ExpoVibesSDK.markInboxMessageAsRead(messageId);
Alert.alert('Success', 'Message marked as read');
loadMessages(); // Refresh messages
} catch (error) {
Alert.alert('Error', 'Failed to mark message as read');
}
};
return (
<ScrollView style={{ flex: 1, padding: 20 }}>
<Text style={{ fontSize: 24, marginBottom: 20 }}>Vibes SDK Example</Text>
<Button title="Login User" onPress={handleLogin} />
{user && (
<Text style={{ marginVertical: 10 }}>Logged in as: {user}</Text>
)}
<Button title="Load Messages" onPress={loadMessages} />
{messages.map((message, index) => (
<View key={index} style={{ marginVertical: 10, padding: 10, backgroundColor: '#f0f0f0' }}>
<Text>{message.title || 'No title'}</Text>
<Button
title="Mark as Read"
onPress={() => markMessageRead(message.id)}
/>
</View>
))}
</ScrollView>
);
}Available Functions
| Function | Description | Parameters | Returns |
|----------|-------------|------------|---------|
| getSDKVersion() | Get Vibes SDK version | None | Promise |
| registerDevice() | Register device with Vibes | None | Promise |
| unregisterDevice() | Unregister device | None | Promise |
| registerPush() | Register for push notifications | None | Promise |
| unregisterPush() | Unregister from push notifications | None | Promise |
| associatePerson(externalPersonId) | Associate user with device | string | void |
| updateDevice(updateCredentials, lat, lon) | Update device info | boolean, number, number | void |
| getPerson() | Get current user information | None | Promise |
| fetchInboxMessages() | Get all inbox messages | None | Promise |
| fetchInboxMessage(messageId) | Get specific message | string | Promise |
| markInboxMessageAsRead(messageId) | Mark message as read | string | Promise |
| expireInboxMessage(messageId) | Expire message | string | Promise |
| onInboxMessageOpen(messageId) | Track message open | string | Promise |
| onInboxMessagesFetched() | Track messages fetched | None | Promise |
| getVibesDeviceInfo() | Get device information | None | Promise |
| setValueAsync(value) | Set value and trigger onChange event | string | Promise |
Full SDK API Usage Examples
Below are examples for all additional SDK functions available in the demo app:
// Get device info
const getDeviceInfo = async () => {
try {
const info = await ExpoVibesSDK.getVibesDeviceInfo();
console.log('Device info:', info);
return info;
} catch (error) {
console.error('Failed to get device info:', error);
return null;
}
};
// Unregister device
const unregisterDevice = async () => {
try {
const result = await ExpoVibesSDK.unregisterDevice();
console.log('Device unregistered:', result);
} catch (error) {
console.error('Failed to unregister device:', error);
}
};
// Unregister push
const unregisterPush = async () => {
try {
const result = await ExpoVibesSDK.unregisterPush();
console.log('Push unregistered:', result);
} catch (error) {
console.error('Failed to unregister push:', error);
}
};
// Open inbox message (track open event)
const openInboxMessage = async (messageId: string) => {
try {
const result = await ExpoVibesSDK.onInboxMessageOpen(messageId);
console.log('Inbox message opened:', result);
} catch (error) {
console.error('Failed to open inbox message:', error);
}
};
// Track inbox messages fetched event
const trackInboxMessagesFetched = async () => {
try {
const result = await ExpoVibesSDK.onInboxMessagesFetched();
console.log('Inbox messages fetched event:', result);
} catch (error) {
console.error('Failed to track inbox messages fetched:', error);
}
};
// Set value async (test event)
const setValue = async (value: string) => {
try {
await ExpoVibesSDK.setValueAsync(value);
console.log('Value set:', value);
} catch (error) {
console.error('Failed to set value:', error);
}
};
// Initialize Vibes SDK manually
const initializeVibes = async () => {
try {
await ExpoVibesSDK.initializeVibes();
console.log('Vibes SDK initialized');
} catch (error) {
console.error('Failed to initialize Vibes SDK:', error);
}
};
// Get SDK version
const getSdkVersion = async () => {
try {
const version = await ExpoVibesSDK.getSDKVersion();
console.log('SDK Version:', version);
return version;
} catch (error) {
console.error('Failed to get SDK version:', error);
return null;
}
};Additional Resources
- Vibes SDK Documentation
- Expo Documentation
- EAS Build Documentation
- Development Builds Guide
- Expo Managed Workflow
Support
If you encounter issues during installation:
- Check the troubleshooting section above
- Review the example project for reference
- Contact Vibes support or create an issue in the repository
Note: This guide is specifically for Expo Managed Workflow with Custom Development Build for Expo 51. This approach allows you to use native modules like Vibes SDK while maintaining the benefits of managed workflow. For bare React Native projects, see the bare workflow documentation.
Change log:
0.3.22 (12.19.2025) | Part | Change (added element) | |------|----------------------| | ### Vibes SDK | Added notification received and opened events for deep linking |
0.3.21 (12.12.2025)
| Part | Change (added element) |
|------|----------------------|
| ### Vibes SDK | Added inboxCustomData to messages received from fetchInboxMessage and fetchInboxMessages functions |
0.3.20 (12.10.2025)
| Part | Change (added element) |
|------|----------------------|
| ### Vibes SDK | Added mainImage and iconImage to messages received from fetchInboxMessage and fetchInboxMessages functions |
0.3.18 (11.24.2025) | Part | Change (added element) | |------|----------------------| | ### Vibes SDK | Fixed Android EAS build .aar file error by implementing maven local repo workaround and also updated AAR of Android SDK - it fixes double promise issue |
0.3.17 (9.22.2025) | Part | Change (added element) | |------|----------------------| | ### Vibes SDK | Improve iOS plugin resilience for scenarios where AppDelegate modifications from other plugins may cause conflicts, add some additional app and SDK logs to see push token flow and if variables are properly set | | ### 2. Configure the plugin | apsEnvironment: process.env.APP_ENV | | ### 3. Environment Variables | apsEnvironment: process.env.APP_ENV, APP_ENV=development, eas secret:create --name APP_ENV --value development | | ### 4. Configure EAS Build | (1) "development": { "env": { "APP_ENV": "$APP_ENV" } },(2) "preview": { "env": { "APP_ENV": "$APP_ENV" } },(3) "production": { "env": { "APP_ENV": "$APP_ENV" } } |
0.3.16 (8.29.2025)
| Part | Change (added element) |
|------|----------------------|
| ### Vibes SDK | Improved code quality and performance by optimizing native iOS delegate functions and removing unused code |
| ### Vibes SDK | Enhanced dependency management and build process optimization for better developer experience |
| ### Warnings | These warnings are not blockers for a successful build. The warnings you see are from React Native and Expo dependencies. |
| ### Important Notes | SDK Compatibility: This SDK automatically adapts to your app's Expo and React Native versions |
| ### Important Notes | Warning Source: Warnings come from React Native/Expo dependencies, not from this SDK |
| ### Important Notes | Resolution: Most warnings disappear when you update React Native and Expo to newer versions |
| ### How to Suppress Warnings | json<br>{<br> "overrides": {<br> "@xmldom/xmldom": "^0.8.10",<br> "rimraf": "^4.4.1",<br> "glob": "^9.3.5"<br> }<br>} |
| ### Legacy Packages (from React Native/Expo) | These packages are used by React Native and Expo dependencies: [email protected], [email protected], [email protected], @babel/plugin-proposal-*, [email protected] |
| ### Usage Guide | Important: The registerDevice() and registerPush() functions return Promises that resolve when the registration is complete. |
| ### Usage Guide | You must ensure registerDevice() completes before calling registerPush() by using .then() chains or await. |
0.3.15 (8.6.2025)
| Part | Change (added element) | |------|----------------------| | ### Vibes SDK | Cleaned up the SDK by removing unused Expo dependencies that were causing the version conflicts | | ### 1. Install the Package | If you continue to encounter errors while installing the Vibes SDK, you can install it using the --legacy-peer-deps flag to ensure the Expo dependencies compatibility and the SDK is installed correctlynpm install vibes-react-native-expo --legacy-peer-deps | | ### 2. Configure the Plugin | iosAppId: process.env.IOS_APP_IDvibesAppEnv: process.env.VIBES_APP_ENV || "UAT" | | ### 3. Environment Variables | iosAppId: process.env.IOS_APP_IDvibesAppEnv: process.env.VIBES_APP_ENV || "UAT"## Setting Environment Variables for EAS Cloud Buildeas secret:create --name IOS_APP_ID --value your-ios-app-ideas secret:create --name VIBES_APP_ENV --value UAT### Setting EAS Secretseas secret:create --name IOS_APP_ID --value your-ios-app-ideas secret:create --name VIBES_APP_ENV --value UAT | | ### 4. Configure EAS Build | (1) "development": { "ios": { "buildConfiguration": "Debug" } "env": { "APP_ENV": "$APP_ENV" } },(2) "preview": { "env": { "APP_ENV": "$APP_ENV" } },(3) "production": { "env": { "APP_ENV": "$APP_ENV" } } | | ### 5. Create Development Build | # For iOS development buildeas build --profile development --platform ios | | ## iOS Configuration Details | ### Automatic ConfigurationThe plugin automatically configures the native iOS files during the EAS build process. You don't need to manually edit these files:#### Info.plistThe plugin automatically adds these keys:VibesAppId$(VIBES_APP_ID)VibesApiUrl$(VIBES_API_URL)VibesAppEnv$(VIBES_APP_ENV)#### AppDelegate.swiftThe plugin automatically initializes the Vibes SDK:import VibesSDK// In your AppDelegate.swiftfunc application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { // Vibes SDK is automatically initialized return true} | | ## Minimum Requirements | ### iOS- iOS Version: 13.0+- Xcode Version: 15.0+- Swift Version: 5.0+ | | ## Troubleshooting -> ### Common Issues -> #### 1. Build Errors | 4. iOS Production Deployment Issueseas build --profile development --platform ios --clear-cacheeas build --profile development --platform ios | | ## Troubleshooting -> ### Common Issues -> #### 4. iOS Production Deployment Issues | Before submitting to App Store:1. Test with Production Certificate: Use production push notification certificate2. Check Certificates and Provisioning Profiles: Verify all certificates and provisioning profiles are valid and properly configured3. Test Push Notifications: Verify notifications work with production configuration | | ## Troubleshooting -> ### Common Issues -> #### 3. Plugin Not Applied | eas build --profile development --platform ios --clear-cache | | ## Debug Steps | 5. Create production build when ready to deploy: eas build --profile production --platform android or eas build --profile production --platform ios |
