If you want to create your own React Native library, scaffolding the project can be a daunting task. create-react-native-library
can scaffold a new project for you with all the necessary tools configured.
react-native-builder-bob
pre-configured to compile your filesTo create new project, run the following:
npx create-react-native-library@latest awesome-library
This will ask you a few questions about your project and generate a new project in a folder named awesome-library
.
After the project is created, you can find the development workflow in the generated CONTRIBUTING.md
file.
Local libraryNote: If you want to create a library using the legacy native modules and view APIs instead of the new architecture, you can use the
0.49.8
version ofcreate-react-native-library
:npx create-react-native-library@0.49.8 awesome-library
.
While the default templates are for libraries that are published to npm, you can also create a local library that is not published but used locally in your app.
You'd typically use a local library when:
The structure of the app with a local library may look like this:
MyApp
├── node_modules
├── modules <-- folder for your local libraries
│ └── awesome-library <-- your local library
├── android
├── ios
├── src
├── index.js
└── package.json
If you run create-react-native-library
in an existing project containing a package.json
, it'll be automatically detected and you'll be asked if you want to create a local library. You can also pass the --local
flag to the command to explicitly create a local library:
npx create-react-native-library@latest awesome-library --local
The local library is created outside of the android
and ios
folders and makes use of autolinking to integrate with your app. It also doesn't include a separate example app and additional dependencies that are configured in the default templates. This is an alternative approach to the setup mentioned in React Native docs (opens in a new tab).
The advantages of this approach are:
android
and ios
folders.By default, the generated library is automatically linked to the project using link:
protocol when using Yarn (opens in a new tab) and file:
when using npm (opens in a new tab):
"dependencies": {
"react-native-awesome-library": "link:./modules/awesome-library"
}
This creates a symlink to the library under node_modules
which makes autolinking work. But if you're using a monorepo or have non-standard setup, you'll need to manually set up the package to be linked to your app based on your project setup.
Once the project is created, you can follow the official React Native docs to learn the API for writing native modules and components:
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4