Generated banner for Create React Native Library
Generated logo for Create React Native Library

Create React Native Library

CallstackOfficialPublished by Callstack

  • Skill
  • Workflow
  • Software development
  • MIT
  • No issues found

From the author

Scaffolds React Native libraries with create-react-native-library for standalone libraries or local native modules and views. Use when creating or working on React Native libraries or adding native functionality in an existing app.
— the description by Callstack

AutoGineer summary

Written by AutoGineer from the skill’s own files, not by the author

This skill provides guidance on using the create-react-native-library CLI to scaffold new React Native libraries or integrate local native modules and views into existing applications. It covers the setup process for various library types, including Turbo Modules, Nitro Modules, and Fabric components, ensuring proper configuration for both standalone projects and monorepo-style local development.

What it does

  • Scaffolds new standalone React Native libraries for npm distribution
  • Integrates local native modules or views directly into existing React Native apps
  • Configures project structures for Turbo Modules, Nitro Modules, and Fabric components
  • Sets up example applications using Expo or React Native Community CLI
  • Provides standardized project layouts with native implementation folders
  • Guides users through post-scaffolding dependency installation and build tasks

When to use it

  • When starting a new React Native library project
  • When adding custom native functionality to an existing React Native application
  • When wrapping native SDKs for use within a React Native environment
  • When you need to create native UI components or native APIs

Advantages

  • Ensures consistent project structure across different library types
  • Automates complex setup for native modules and autolinking
  • Provides built-in example apps for immediate testing and development
  • Supports modern React Native architectures like Turbo Modules and Nitro

Usage examples

“Scaffold a new React Native library named my-native-lib with Turbo Modules and an Expo example.”
The agent executes the CLI command with the appropriate flags to generate a library structure with Kotlin/Obj-C support and an Expo example app.
“How do I add a local native module to my existing React Native project?”
The agent provides the command to run the CLI with the --local flag from the app root, creating a module under the modules/ directory.

Install

  1. Download the skill as a ZIP:

    https://mp-staging.autogineer.com/agent-skills/callstackincubator/create-react-native-library/download
  2. Unzip it into the cross-client skills folder of your project:

    mkdir -p .agents/skills && unzip create-react-native-library.zip -d .agents/skills

Documentation by Callstack

Create React Native Library

Overview

Use this skill to scaffold a standalone React Native library or a local library inside an existing app, then continue with the correct implementation docs.

Examples:

  • JS-only library that may use other React Native libraries

  • Native modules that expose native functionality to JavaScript

  • Native UI components that render native views in React Native

Choose one flow first:

When to Apply

Use this skill when:

  • Creating or working on a React Native library with create-react-native-library

  • Creating a native module or view in an existing app

  • Wrapping native SDKs and exposing them to React Native

Quick Reference

# Inspect current options before scaffolding
npx create-react-native-library@latest --help

# Scaffold a library with turbo modules and the Expo example app
npx create-react-native-library@latest awesome-library \
  --no-interactive \
  --yes \
  --description "A brief description of the library" \
  --type turbo-module \
  --languages kotlin-objc \
  --example expo

# Scaffold a local Turbo Module inside an existing app
cd MyApp
npx create-react-native-library@latest awesome-library \
  --local \
  --no-interactive \
  --yes \
  --description "A brief description of the library" \
  --type turbo-module \
  --languages kotlin-objc

References

FileDescription
scaffold-library.mdScaffold a new library and default to the Expo example
local-library.mdAdd a local library to an existing app with autolinking

Problem -> Skill Mapping

ProblemStart With
Need a new library scaffoldscaffold-library
Need to add a local native library to an applocal-library

Files

references/scaffold-library.md


title: Create a React Native Library impact: HIGH tags: react-native, library, create-react-native-library, expo, builder-bob, scaffolding

Skill: Create a React Native Library

Scaffold a new library with create-react-native-library.

When to Use

  • Starting a new React Native library that may be published to npm

  • Working on an existing React Native library scaffolded with create-react-native-library

Prerequisites

  • Node.js version should match one of the following:

    • 20.19.0 or higher (LTS)

    • 22.12.0 or higher (LTS)

    • 23.4.0 or higher

Step-by-Step Instructions

Progress checklist:
- [ ] Scaffold library with CLI
- [ ] Read generated CONTRIBUTING.md for next steps
- [ ] Run yarn install to set up dependencies
- [ ] Run post install tasks (e.g. prebuild, pod-install, nitrogen)
- [ ] Run example app to test the library
  • Run npx create-react-native-library@latest --help to check the latest available options.

  • Choose the appropriate --type based on user's requirements:

    • Use turbo-module or nitro-module for exposing native APIs.

    • Use fabric-view or nitro-view for rendering native UI components.

    • Use library for a JS-only package.

  • Choose the appropriate --languages based on the --type:

    • Use kotlin-objc for Turbo Modules or Fabric Components.

    • Use kotlin-swift for Nitro Modules or Nitro Views.

    • Use js for a JS-only library.

  • Choose the appropriate --example:

    • Use expo for a managed Expo example app. This is recommended for smoother upgrades unless the user explicitly requests a different example.

    • Use vanilla for an app with React Native Community CLI.

    • Use test-app for a Microsoft's React Native Test App example.

  • Run the npx create-react-native-library@latest command with the appropriate flags to scaffold the library:

    # Scaffold a library with turbo modules and the Expo example app
    npx create-react-native-library@latest awesome-library \
      --no-interactive \
      --yes \
      --description "A brief description of the library" \
      --type turbo-module \
      --languages kotlin-objc \
      --example expo
  • Read the generated CONTRIBUTING.md for project-specific install, build, lint, test, and release instructions.

  • Run yarn install after scaffolding to set up dependencies.

  • When using expo example for native modules and views, run yarn example expo prebuild to generate native code for the example app.

  • For native modules and views, run cd example && npx pod-install to install CocoaPod dependencies.

  • For nitro modules and views, run yarn nitrogen to generate required native code before building the example app.

  • Use yarn example start to start the metro bundler for the example app.

  • Use yarn example ios or yarn example android to run the example app on a simulator or device.

  • Use yarn example web to run the example app in a web browser if the library should work on web.

Generated Project Structure

Typical generated layout:

awesome-library/
  src/              TypeScript entry points
  example/          Example app to test the library during development
  android/          Android native implementation when applicable
  ios/              iOS native implementation when applicable
  package.json      Package metadata, scripts and config
  CONTRIBUTING.md   Development workflow for the generated project

The exact files vary by --type, --languages, and selected tools.

Common Pitfalls

  • Not using Yarn: The generated project uses a monorepo based on Yarn workspaces. Only use yarn and do not use other package managers.

  • Using incompatible Node.js version: Ensure the Node.js version matches the required versions mentioned in the prerequisites.

  • Incorrectly adding native dependencies: Any React Native libraries that contain native code and are used in the library must be added as peerDependencies and devDependencies in the library's root package.json, then dependencies of the example app's package.json.

Canonical Docs

Requirements and compatibility

Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta

“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.

Needs: Needs Node.js

Security

No issues found by our static scan· No issues found

A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.

Attribution and licence

Published by
Callstack
Publisher
Callstack (Official)
Source
callstackincubator/agent-skills · skills/create-react-native-library · commit 59e9d17
Licence
MIT License (redistribution allowed)
  • LICENSE (added by AutoGineer from LICENSE)
  • ATTRIBUTION.md (written by AutoGineer)
Synced

AutoGineer is not affiliated with or endorsed by Callstack.

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download create-react-native-library.zip