React Native AI Skills
Overview
Example workflow for integrating on-device AI in React Native apps using the @react-native-ai ecosystem. Available provider tracks (can be combined):
- Apple – Apple Intelligence (iOS 26+)
- Llama – GGUF models via llama.rn
- MLC – MLC-LLM models
- NCNN – Low-level NCNN inference wrapper (vision, custom models)
Path Selection Gate (Must Run First)
Before selecting any reference file, classify the user request:
- Select Apple:
- if you intend to build with:
apple, Apple Intelligence, Apple Foundation Models
- if you want features:
transcription, speech synthesis, embeddings on Apple devices
- optionally with capabilities: tool calling
- Select Llama:
- if you intend to use the following technologies:
llama, GGUF, llama.rn, HuggingFace, SmolLM
- if you want to perform the following operations:
embedding model, rerank, speech model
- Select MLC:
- if you intend to use a library that allows for custom models and involves build-time model optimizations
- Select NCNN:
- if you need to use run low-level inference on bare metal tensors
- if you intend to run inference of custom models such as convolutional networks, multi-layer perceptrons, low-level inference, etc.
- DO NOT select NCNN if the prompt mentions LLMs only, this use case is better solved by other providers
Skill Format
Each reference file follows a strict execution format:
- Quick Command
- When to Use
- Prerequisites
- Step-by-Step Instructions
- Common Pitfalls
- Related Skills
Use the checklists exactly as written before moving to the next phase.
When to Apply
Reference this package when:
- Integrating on-device AI in React Native apps
- Installing and configuring @react-native-ai providers
- Managing model downloads (llama, mlc)
- Wiring providers with Vercel AI SDK (generateText, streamText)
- Implementing SetupAdapter pattern for multi-provider apps
- Debugging native module or Expo plugin issues
Priority-Ordered Guidelines
| Priority |
Category |
Impact |
Start File |
| 1 |
Path selection and baseline |
N/A |
quick-start |
| 2 |
Apple provider |
N/A |
apple-provider |
| 3 |
Llama provider |
N/A |
llama-provider |
| 4 |
MLC-LLM provider |
N/A |
mlc-provider |
| 5 |
NCNN provider |
N/A |
ncnn-provider |
Quick Reference
npm install
# Provider-specific install
npm add @react-native-ai/apple
npm add @react-native-ai/llama llama.rn
npm add @react-native-ai/mlc
npm add @react-native-ai/ncnn-wrapper
Route by path:
- Apple: apple-provider
- Llama: llama-provider
- MLC: mlc-provider
- NCNN: ncnn-provider
References
| File |
Impact |
Description |
| quick-start |
N/A |
Shared preflight |
| apple-provider |
N/A |
Apple Intelligence setup and integration |
| llama-provider |
N/A |
GGUF models, llama.rn, model management |
| mlc-provider |
N/A |
MLC models, download, prepare, Expo plugin |
| ncnn-provider |
N/A |
NCNN wrapper, loadModel, runInference |
Problem → Skill Mapping
| Problem |
Start With |
| Need path decision first |
quick-start |
| Integrate Apple Intelligence |
apple-provider |
| Run GGUF models from HuggingFace |
llama-provider |
| Run MLC-LLM models (Llama, Phi, Qwen) |
mlc-provider |
| Use NCNN for custom inference |
ncnn-provider |
| Multi-provider app with SetupAdapter |
quick-start → provider-specific |
| Expo + native module setup |
Provider-specific (each has Expo notes) |
1---2name: react-native-ai-skills3description: Provides integration recipes for the React Native AI @react-native-ai packages that wrap the Llama.rn (Llama.cpp), MLC-LLM, Apple Foundation backends. Use when integrating local on-device AI in React Native, setting up providers, model management.4license: MIT5---67# React Native AI Skills89## Overview1011Example workflow for integrating on-device AI in React Native apps using the @react-native-ai ecosystem. Available provider tracks (can be combined):1213- **Apple** – Apple Intelligence (iOS 26+)14- **Llama** – GGUF models via llama.rn15- **MLC** – MLC-LLM models16- **NCNN** – Low-level NCNN inference wrapper (vision, custom models)1718## Path Selection Gate (Must Run First)1920Before selecting any reference file, classify the user request:21221. Select **Apple**:23 - if you intend to build with: `apple`, `Apple Intelligence`, `Apple Foundation Models`24 - if you want features: `transcription`, `speech synthesis`, `embeddings` on Apple devices25 - optionally with capabilities: tool calling262. Select **Llama**:27 - if you intend to use the following technologies: `llama`, `GGUF`, `llama.rn`, `HuggingFace`, `SmolLM`28 - if you want to perform the following operations: `embedding model`, `rerank`, `speech model`293. Select **MLC**:30 - if you intend to use a library that allows for custom models and involves build-time model optimizations314. Select **NCNN**:32 - if you need to use run low-level inference on bare metal tensors33 - if you intend to run inference of custom models such as convolutional networks, multi-layer perceptrons, low-level inference, etc.34 - DO NOT select NCNN if the prompt mentions LLMs only, this use case is better solved by other providers3536## Skill Format3738Each reference file follows a strict execution format:3940- Quick Command41- When to Use42- Prerequisites43- Step-by-Step Instructions44- Common Pitfalls45- Related Skills4647Use the checklists exactly as written before moving to the next phase.4849## When to Apply5051Reference this package when:5253- Integrating on-device AI in React Native apps54- Installing and configuring @react-native-ai providers55- Managing model downloads (llama, mlc)56- Wiring providers with Vercel AI SDK (generateText, streamText)57- Implementing SetupAdapter pattern for multi-provider apps58- Debugging native module or Expo plugin issues5960## Priority-Ordered Guidelines6162| Priority | Category | Impact | Start File |63| -------- | --------------------------- | ------ | -------------------------------- |64| 1 | Path selection and baseline | N/A | [quick-start][quick-start] |65| 2 | Apple provider | N/A | [apple-provider][apple-provider] |66| 3 | Llama provider | N/A | [llama-provider][llama-provider] |67| 4 | MLC-LLM provider | N/A | [mlc-provider][mlc-provider] |68| 5 | NCNN provider | N/A | [ncnn-provider][ncnn-provider] |6970## Quick Reference7172```bash73npm install7475# Provider-specific install76npm add @react-native-ai/apple77npm add @react-native-ai/llama llama.rn78npm add @react-native-ai/mlc79npm add @react-native-ai/ncnn-wrapper80```8182Route by path:8384- Apple: [apple-provider][apple-provider]85- Llama: [llama-provider][llama-provider]86- MLC: [mlc-provider][mlc-provider]87- NCNN: [ncnn-provider][ncnn-provider]8889## References9091| File | Impact | Description |92| -------------------------------- | ------ | ------------------------------------------ |93| [quick-start][quick-start] | N/A | Shared preflight |94| [apple-provider][apple-provider] | N/A | Apple Intelligence setup and integration |95| [llama-provider][llama-provider] | N/A | GGUF models, llama.rn, model management |96| [mlc-provider][mlc-provider] | N/A | MLC models, download, prepare, Expo plugin |97| [ncnn-provider][ncnn-provider] | N/A | NCNN wrapper, loadModel, runInference |9899## Problem → Skill Mapping100101| Problem | Start With |102| ------------------------------------- | ---------------------------------------------- |103| Need path decision first | [quick-start][quick-start] |104| Integrate Apple Intelligence | [apple-provider][apple-provider] |105| Run GGUF models from HuggingFace | [llama-provider][llama-provider] |106| Run MLC-LLM models (Llama, Phi, Qwen) | [mlc-provider][mlc-provider] |107| Use NCNN for custom inference | [ncnn-provider][ncnn-provider] |108| Multi-provider app with SetupAdapter | [quick-start][quick-start] → provider-specific |109| Expo + native module setup | Provider-specific (each has Expo notes) |110111[quick-start]: references/quick-start.md112[apple-provider]: references/apple-provider.md113[llama-provider]: references/llama-provider.md114[mlc-provider]: references/mlc-provider.md115[ncnn-provider]: references/ncnn-provider.md