@vibecodeapp/sdk

SDK for Vibecodeapp.com - Web polyfills and Metro configuration for React Native.

Installation

npm install @vibecodeapp/sdk
# or
yarn add @vibecodeapp/sdk
# or
pnpm add @vibecodeapp/sdk

Metro Configuration

The SDK provides a Metro wrapper that adds:

• Web polyfills for native modules
• HTTP/2 remote cache support
• Configurable local file caching

Basic Usage

// metro.config.js
const { getDefaultConfig } = require("expo/metro-config");
const { withVibecodeMetro } = require("@vibecodeapp/sdk/metro");

const config = getDefaultConfig(__dirname);

module.exports = withVibecodeMetro(config);

With NativeWind

// metro.config.js
const { getDefaultConfig } = require("expo/metro-config");
const { withNativeWind } = require("nativewind/metro");
const { withVibecodeMetro } = require("@vibecodeapp/sdk/metro");

const config = getDefaultConfig(__dirname);

// Apply Vibecode config first, then NativeWind
module.exports = withNativeWind(
  withVibecodeMetro(config),
  { input: "./global.css" }
);

With Remote HTTP Cache

// metro.config.js
const { getDefaultConfig } = require("expo/metro-config");
const { withVibecodeMetro } = require("@vibecodeapp/sdk/metro");

const config = getDefaultConfig(__dirname);

module.exports = withVibecodeMetro(config, {
  httpEndpoint: process.env.METRO_CACHE_HTTP_ENDPOINT,
  httpTimeout: 30000,
  httpMaxConnections: 64,
  httpMaxConcurrent: 256,
});

Configuration Options

| Option | Type | Default | Description | |--------|------|---------|-------------| | enableCache | boolean | true | Enable cache configuration | | cacheDir | string | ~/.metro-cache | Local cache directory | | cacheVersion | string | "1" | Cache version (increment to invalidate) | | httpEndpoint | string | - | HTTP/2 cache server URL | | httpTimeout | number | 30000 | HTTP request timeout (ms) | | httpMaxConnections | number | 64 | HTTP/2 connection pool size | | httpMaxConcurrent | number | 256 | Max concurrent HTTP requests |

Environment Variables

The SDK also respects these environment variables:

| Variable | Description | |----------|-------------| | METRO_CACHE_DIR | Local cache directory | | METRO_CACHE_VERSION | Cache version string | | METRO_CACHE_HTTP_ENDPOINT | HTTP/2 cache server URL |

Web Polyfills

The SDK automatically provides web polyfills for:

| Native Module | Web Implementation | |---------------|-------------------| | expo-haptics | Vibration API | | expo-secure-store | localStorage | | react-native-maps | Google Maps (@teovilla/react-native-web-maps) | | RefreshControl | Custom PanResponder implementation | | Alert | Web-compatible alert dialog |

Environment Variables for Polyfills

| Variable | Purpose | |----------|---------| | EXPO_PUBLIC_GOOGLE_MAPS_API_KEY | Google Maps API key (for web maps) |

License

MIT