# @sk39/expo-image-cache

> Image Cache for React Native Expo

Latest version **1.0.0** (published 2020-10-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install @sk39/expo-image-cache
pnpm add @sk39/expo-image-cache
yarn add @sk39/expo-image-cache
bun add @sk39/expo-image-cache
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2020-10-08 |
| First published | 2020-10-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 36.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | sk39 |
| Maintainers | sk39 |
| Keywords | react, react native, expo, image, cache |

## Links

- npm: https://www.npmjs.com/package/@sk39/expo-image-cache
- Repository: https://github.com/sk39/expo-image-cache
- Homepage: https://github.com/sk39/expo-image-cache#readme
- Issues: https://github.com/sk39/expo-image-cache/issues
- npm.io page: https://npm.io/package/@sk39/expo-image-cache

## Dependencies (2)

- [react-native-expo-image-cache](https://npm.io/package/react-native-expo-image-cache.md) ^4.1.0
- [react-native-skeleton-content](https://npm.io/package/react-native-skeleton-content.md) ^1.0.20

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.0 (latest) — 2020-10-08

## README

# expo-image-cache

Image Cache for React Native Expo.

[![NPM](https://img.shields.io/npm/v/@sk39/expo-image-cache.svg)](https://www.npmjs.com/package/@sk39/expo-image-cache)


![20201008_190924](https://user-images.githubusercontent.com/28267362/95445312-da2d9a00-0999-11eb-8a3b-3c9346daceb6.gif)

* Use [react-native-expo-image-cache](https://github.com/wcandillon/react-native-expo-image-cache).
* Load only once if many components display the same image at the same time.
* Show skeleton loader while loading. Use [react-native-skeleton-content](https://github.com/alexZajac/react-native-skeleton-content).

## Install

```bash
npm install @sk39/expo-image-cache
```

## Usage

### Props

| Props        | Default     | Description  |
| ------------- |:-------------:| -----:|
| source      | - | ImagSource |
| backgroundColor     | '#e9eaf8'      |  |
| onLoaded     |  null    |  |
| onError     | null      |  |

### CacheImage
```jsx
import React, { Component } from 'react'
import {CacheImage} from "@sk39/expo-image-cache"

class Example extends Component {
  render () {
    const source = {uri: "https://picsum.photos/510/300?random"}
    return (
        <View style={{width: 100, height: 60}}>
            <CacheImage source={source}/>
        </View>
    )
  }
}
```

### Clear cache

```ts
import {ImageStore} from "@sk39/expo-image-cache";

await ImageStore.getInstance().clear()
```

## License

MIT © [sk39](https://github.com/sk39)

---
_Source: https://npm.io/package/@sk39/expo-image-cache · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._