Collectives™ on Stack Overflow
Find centralized, trusted content and collaborate around the technologies you use most.
Learn more about Collectives
Teams
Q&A for work
Connect and share knowledge within a single location that is structured and easy to search.
Learn more about Teams
Note:
from React-Native
0.60.0
linking packages using
react-native link
has become redundant. Autolink has been added to the React-Native CLI which means that iOS will now use cocoapods and Android will use gradle. You can read more about Autolinking
here
.
What is
react-native link
?
react-native link
is an automatic way for installing native dependencies. It is an alternative to manually linking the dependency in your project. It works for both Android and iOS.
When linking a project manually the majority of the steps are the same and so using
react-native link
allows you to install the native dependency with less fuss and without having to type similar code or perform similar actions repeatedly.
However, it should be noted that running
react-native link
will not always link a package fully, sometimes additional steps are required and you
should check
carefully with the installation instructions.
Always read the instructions carefully before installing a dependency and linking it.
iOS Considerations
If your project is using
CocoaPods
and the dependency that you are linking has a
.podspec
then when you use run
react-native link
it will update your
Podfile
. This is instead of adding the files directly to your Xcode project. You will also have to run
pod install
inside your
ios
directory otherwise the native dependency won't be fully installed.
Sometimes installing using
CocoaPods
can cause more issues, and not every dependency needs to be installed with
CocoaPods
you could always follow the steps that I outlined in this SO
answer
to stop
react-native link
adding a dependency to the
Podfile
, it is not ideal but it is a workaround. Some dependencies require additions to be made to the
Podfile
, so you should only do this if the dependency doesn't require
pods
to run.
react-native link
or
react-native link dependency-name
Should you just use
react-native link
when linking any dependency or should you be more explicit and use
react-native link dependency-name
?
From my experience it is better to use
react-native link dependency-name
. This is due to the fact that
react-native link
will try to link (or re-link) all the dependencies that can be linked and this can lead to code duplication. Most of the issues that I have experienced have been when the Android native dependency is being linked. I think there has been some headway in stopping this from happening in subsequent updates, but the old adage applies here
once bitten, twice shy
Linking good practice
When using
react-native link dependency-name
you should follow good practice so that you don't get stung. Sometimes dependencies that you try don't work as expected and removing all the code that was added during the linking process can be tricky. (Xcode project files can be a nightmare to go through if you are unfamiliar with them).
This is how I install dependencies and then link them.
Make sure that you are using version control, like
git
.
Make sure your code is fully committed with no unsaved changes.
Create a new branch, and check it out.
Install your dependency
npm i dependency-name
Then link you dependency
react-native link dependency-name
Perform any additional installation steps that the dependency requires. See the installation instructions for the dependency.
Check that your code works with the new dependency.
commmit
changes and merge the branch.
Manual Linking
If you prefer to link your native dependencies manually then you should either follow the instructions on the dependency's website or you can look at the documentation that react-native provides.
Currently there is only an explanation on how to manually link
iOS
projects.
Manually linking
Android
requires you to make changes in the following locations:
settings.gradle
app/build.gradle
MainApplication.java
As always for the exact changes that you should make you should look at the dependency's manual linking instructions.
Do I have to link?
It depends on the dependency that you are using some dependencies use only code written in Javascript, so it is not required to link them, and there is no benefit served by running
react-native link dependency-name
.
However, if the dependency contains
native code
then you will have to link. Either manually or by using
react-native link dependency-name
.
How can I tell if I need to link the dependency?
Firstly you need to check the website, the github repo, or the npmjs.com page for the dependency. There will usually be instructions there telling you whether to link the dependency after you have installed it.
If you cannot find any instructions about linking, you (probably) won't need to link it.
If you are still unsure, check with the dependency maintainer.
Can I just run link anyway?
Yes, you can it won't do anything if there is nothing to link. But always run it with
react-native link dependency-name
to avoid issues.
When do I run link?
You only run it after you have installed your dependency. I would recommend running it just after you have installed the dependency. You should then check to make sure that it works, before installing any new dependencies so that you can easily debug.
You shouldn't need to run it more than once per dependency.
It doesn't matter how many components or changes to the javascript code that you make it won't affect the linking, as the linking is purely native and components are javascript.
What is autolink?
Autolink is a new feature that is being added to the
react-native-cli
. You can read more about autolink
here
.
Autolink
replaces
react-native-link
Autolinking is a mechanism built into CLI that allows adding a
dependency with native components for React Native to be as simple as:
yarn add react-native-webview
Autolinking is a replacement for react-native link that brings new features (such as ability to easily integrate native dependencies on iOS) and fixes some of the long-standing issues.
Once it is fully implemented it should make adding dependencies with native-code to your project much easier.
–
–
–
–
Linking native library means that you are going to integrate already implemented module into your application or module which completes your react native's module functionality.
Steps to integrate lib(android):
1) Add package name to new packages() 2) Add dependencies to settings.gradle file and main application's gradle i.e app/gradle file. 3) sync the projects gradle because you made changes in the gradle and it's done.
All manual steps like below you have to perform
1) Go to your project's home dir using cmd.
2) run npm install
3) Thereafter run rnpm link or react-native link
4) see ios folder in your project folder and if you find any pod file then run pod install after navigating into ios folder in cmd.
now instead,
1) Go to your project's home dir using cmd.
2) run npm install
3) Thereafter run rnpm link or react-native link
4) see ios folder in your project folder and if you find any pod file then run pod install after navigating into ios folder in cmd.
When you've installed a library with native content(android or ios) then you need to require linking to the component react-native library.
like this
react-native link react-native-sound-player
When you installed any third party library with native content,you have to link the dependencies in android and ios. react-native link is responsible for including the dependencies in gradlew and pod files.
for suppose you installed react-native-vector-icons package then you have to link in your gradlew files. the new version of react native 0.60 has auto linking.
npm install react-native-vector-icons
react-native link react-native-vector-icons
–
Thanks for asking this question
if you are working with fonts
react-native link is used for linking the fonts and assets to project
link command is also for linking the libraries to react-native
But now React-native too better so there is no need to link the library
we can use
pos install
npx jetify
it will automatically link the libraries
–
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.