create-react-native-library

어떤 스킬인가요?

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.

설치 방법

프로젝트 폴더에서 아래 명령어를 실행하고, 설치할 에이전트를 선택하세요.

설치 명령을 직접 실행해야 적용됩니다. 지원 에이전트와 필요한 권한·라이선스는 제작자의 안내를 확인하세요.

스킬 원문 파일

interface:
  display_name: "Create React Native Library"
  short_description: "Scaffold standalone libraries or local app modules"
  default_prompt: "Use $create-react-native-library to scaffold a standalone React Native library or a local app module with create-react-native-library, verify the current CLI help first, and route to the correct official native docs after scaffolding."

---
title: Add a Local Library to an Existing App
impact: HIGH
tags: react-native, library, create-react-native-library, local, autolinking, monorepo, expo
---

# Skill: Add a Local Library to an Existing App

Scaffold a local library inside an existing React Native app with `create-react-native-library`.

## When to Use

- Adding native functionality or UI components to an existing React Native app

## Prerequisites

- An existing React Native app with `package.json` at the root

## Step-by-Step Instructions

```text
Progress checklist:
- [ ] Create local library with CLI
- [ ] Verify symlink setup in node_modules
- [ ] Install dependencies to create symlink
- [ ] Import and use the library in the app
```

- 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.
- 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.
- Run the `npx create-react-native-library@latest` command with the `--local` flag from the root of the existing app to scaffold a local library under the `modules/` folder:

  ```bash
  cd MyApp

  # Scaffold a local Turbo Module inside the app repo
  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
  ```

- Verify the local library is linked correctly in the app's `dependencies` in `package.json`:
  - If the app uses Yarn, the generated dependency entry in `package.json` should use `link:` (`"react-native-awesome-library": "link:./modules/awesome-library"`)
  - If the app uses npm, the generated dependency entry in `package.json` should use `file:` (`"react-native-awesome-library": "file:./modules/awesome-library"`)
  - For other package manager setups, refer to the package manager documentation on how to create symlink under `node_modules` that points to the local library.
- Run `yarn install` or `npm install` from the app root to create the symlink under `node_modules` that points to the local library.
- For nitro modules or views, ensure `react-native-nitro-modules` dependency is added to the app's `package.json`.
- Import the library with its package name (e.g. `import { multiply } from 'react-native-awesome-library'`) in the app to use it.

## Generated Project Structure

Typical generated layout:

```text
MyApp/
  package.json
  modules/
    awesome-library/
      src/            TypeScript entry points
      android/        Android native implementation
      ios/            iOS native implementation
      package.json    Local package metadata
```

The local library is self contained under the `modules/` folder and is symlinked into the app's `node_modules/` for autolinking.

## Common Pitfalls

- **Not running the command from an app directory**: Run from a React Native app directory that already contains `package.json`.
- **Using incorrect combination of `--type` and `--languages`**: Use `kotlin-objc` for turbo modules and fabric views, and use `kotlin-swift` for nitro modules and nitro views.

## Canonical Docs

- [Local library](https://oss.callstack.com/react-native-builder-bob/create#local-library)
- [React Native Turbo Modules](https://reactnative.dev/docs/turbo-native-modules-introduction)
- [React Native Fabric Native Components](https://reactnative.dev/docs/fabric-native-components-introduction)
- [Nitro Modules Getting Started](https://nitro.margelo.com/docs/getting-started/what-is-nitro)

---
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

```text
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:

  ```bash
  # 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:

```text
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

- [Scaffold a React Native library](https://oss.callstack.com/react-native-builder-bob/create)
- [React Native Turbo Modules](https://reactnative.dev/docs/turbo-native-modules-introduction)
- [React Native Fabric Native Components](https://reactnative.dev/docs/fabric-native-components-introduction)
- [Nitro Modules - Getting Started](https://nitro.margelo.com/docs/getting-started/what-is-nitro)

---
name: create-react-native-library
description: 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.
license: MIT
---

# 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:

- Use [scaffold-library.md][scaffold-library] when creating a new library that may be published to npm
- Use [local-library.md][local-library] when exposing native functionality in a React Native app

## 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

```bash
# 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

| File                                    | Description                                             |
| --------------------------------------- | ------------------------------------------------------- |
| [scaffold-library.md][scaffold-library] | Scaffold a new library and default to the Expo example  |
| [local-library.md][local-library]       | Add a local library to an existing app with autolinking |

## Problem -> Skill Mapping

| Problem                                      | Start With                           |
| -------------------------------------------- | ------------------------------------ |
| Need a new library scaffold                  | [scaffold-library][scaffold-library] |
| Need to add a local native library to an app | [local-library][local-library]       |

[scaffold-library]: references/scaffold-library.md
[local-library]: references/local-library.md