Registry / storage / react-native-expo-image-cache

react-native-expo-image-cache

JSON →
library4.1.0jsnpmunverified

React Native image cache and progressive loading component based on Expo. Current stable version is 4.1.0. Release cadence is irregular, with major version bumps following Expo SDK updates. Key differentiators: built on Expo File System, supports preview placeholder, transition duration, and programmatic cache management. Ships TypeScript definitions.

npm install react-native-expo-image-cache
INSTALL
IMPORT
SIG · REACT-NATIVE-EXPO-
R
react-native-expo-image-cache
storagejavascriptv4.1.0
harness data pending
Install & Compatibility
Where this runs

No compatibility data collected yet for this library.

Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

Image
import { Image } from 'react-native-expo-image-cache'
const Image = require('react-native-expo-image-cache').Image
ESM named import is correct. Default import is not supported. TypeScript types are included.
CacheManager
import { CacheManager } from 'react-native-expo-image-cache'
import CacheManager from 'react-native-expo-image-cache'
Named import only. CacheManager is a singleton with methods get() and clearCache().
type ImageProps
import { Image } from 'react-native-expo-image-cache'; type MyProps = Image['props']
import { ImageProps } from 'react-native-expo-image-cache'
No direct export of ImageProps; infer from Image component. Available in TypeScript types.

Shows import of Image and CacheManager, usage of Image component with preview and uri props, and async retrieval of cached file path.

import { Image, CacheManager } from 'react-native-expo-image-cache'; const preview = { uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==' }; const uri = 'https://example.com/image.png'; export const CachedImage = () => ( <Image style={{ height: 100, width: 100 }} {...{preview, uri}} /> ); // Optional: get local path const getPath = async () => { const path = await CacheManager.get(uri).getPath(); console.log(path); };
Debug
Known issues
breakingVersion 4.x drops support for React Native <0.60 and Expo SDK <36.
fix
Upgrade to React Native 0.60+ and Expo SDK 36+.
affects: >=4.0.0
gotchaCacheManager.get(uri).getPath() returns undefined if download fails.
fix
Always check if path is undefined before use.
affects: >=1.0.0
gotchaThe preview prop must be a local image require or a data URI, not a remote URL.
fix
Use require('./preview.png') or a base64 data URI for preview.
affects: >=1.0.0
deprecatedManual cache clearance must be done with async/await.
fix
Use await CacheManager.clearCache() instead of synchronous calls.
affects: >=4.0.0
breakingIn version 3.x, Image component required tint prop; in 4.x tint defaults to 'dark' and is optional.
fix
Remove tint prop if using default.
affects: >=4.0.0
Errors
Common errors & fixes
Module not found: Can't resolve 'react-native-expo-image-cache'
Package not installed or missing peer dependencies.
fix
Run: yarn add react-native-expo-image-cache expo-blur expo-file-system
You attempted to set a key 'uri' on a non-object. Check the render method of Image.
Incorrect spread of props object. {...{preview, uri}} is correct, not {...preview, uri}.
fix
Use {...{preview, uri}} or pass preview={preview} uri={uri} directly.
TypeError: undefined is not an object (evaluating 'path.length')
CacheManager.get(uri).getPath() returned undefined because download failed.
fix
Wrap in if (path) { ... } and ensure the remote URI is accessible.
Possible Unhandled Promise Rejection: Error: Cannot read property 'getInfoAsync' of null
expo-file-system not installed or improperly linked.
fix
Install expo-file-system and run expo install expo-file-system.
Upgrade
Version history
4.1.0latest on npm
Audit
Dependencies
expo-blurrequiredPeer dependency for image blur effect
expo-file-systemrequiredPeer dependency for caching images
reactrequiredPeer dependency
react-nativerequiredPeer dependency
Agent activity
17 hits · last 30 days
node
16
Amazon
1
Resources
react-native-expo-image-cache — npm install react-native-expo-image-cache · libregistry