# Bundle an Asset Store filter in React Native

> Package .nosmai resources in the native iOS and Android projects, then discover and apply them through the React Native API.

> For AI agents: the complete documentation index is at https://nosmai.com/llms/effects.txt

Product: Nosmai Effects
Group: guide
Source: https://nosmai.com/docs/effects/guides/filters/bundle-an-asset-store-filter/react-native/

## Prerequisites

- A working [React Native quickstart](/docs/effects/quickstart/react-native/)
- A downloaded `.nosmai` package and its required resources

## Add native resources

React Native does not apply a Metro `require()` value. Package the resources in
both native projects:

- iOS: `nosmai_filters/<name>/` in Copy Bundle Resources
- Android: `app/src/main/assets/Nosmai_Filters/<name>/`

Each folder contains the `.nosmai` file and matching manifest and preview
files.

## Discover and apply it

```tsx
const packages = await NosmaiCameraSdk.getLocalFilters();
const selected = packages.find((item) => item.name === 'heart_face');

if (selected) {
  await NosmaiCameraSdk.applyEffect(selected.path);
}
```

Do not pass a Metro asset number, directory, remote URL, or guessed path.

## Verify it worked

Build both native targets, open the same screen, and confirm the package is
discovered and applied on iOS and Android.

## Common errors

| Error | Fix |
| --- | --- |
| `E_INVALID_PACKAGE_PATH` | Use the path returned by `getLocalFilters` |
| `E_EFFECT_APPLY` | Verify package integrity and native SDK compatibility |
| Works on only one platform | Add the resources to the missing native target |

## Next steps

- [Download a Cloud Filter in React Native](/docs/effects/guides/filters/download-a-cloud-filter/react-native/)
- [Review React Native support](/docs/effects/platforms/react-native/)

## References

- [Filters and effects](/docs/effects/concepts/filters-and-effects/)