2023-10-26 08:54:14 +02:00
# Installation
Using npm:
```shell
npm install --save react-native-video
```
or using yarn:
```shell
yarn add react-native-video
```
Then follow the instructions for your platform to link react-native-video into your project
# Specific platform installation
< details >
< summary > iOS< / summary >
## iOS
### Standard Method
2024-04-04 13:23:44 +02:00
Run `pod install` in the `ios` directory of your project.
2023-10-26 08:54:14 +02:00
2023-11-13 21:36:16 +01:00
### Enable custom feature in podfile file
2023-10-26 08:54:14 +02:00
2024-05-07 17:25:09 +02:00
Samples available in sample app see [sample pod file ](https://github.com/TheWidlarzGroup/react-native-video/blob/9c669a2d8a53df36773fd82ff0917280d0659bc7/examples/basic/ios/Podfile#L34 )
2023-12-23 11:10:04 +01:00
#### Video caching
2023-10-26 08:54:14 +02:00
2023-11-13 21:36:16 +01:00
To enable Video caching usage, add following line in your podfile:
([more info here ](other/caching.md ))
```podfile
# enable Video caching
+ $RNVideoUseVideoCaching=true
2023-10-26 08:54:14 +02:00
```
#### Google IMA
Google IMA is the google SDK to support Client Side Ads Integration (CSAI), see [google documentation ](https://developers.google.com/interactive-media-ads/docs/sdks/ios/client-side ) for more information.
To enable google IMA usage define add following line in your podfile:
```podfile
$RNVideoUseGoogleIMA=true
```
< / details >
< details >
< summary > Android< / summary >
## Android
2023-11-08 07:41:17 +01:00
From version >= 6.0.0, your application needs to have kotlin version >= 1.7.0
```:
buildscript {
...
ext.kotlinVersion = '1.7.0'
...
}
```
2023-10-26 08:54:14 +02:00
### Enable custom feature in gradle file
2024-04-16 14:23:19 +02:00
You can disable or enable the following features by setting the following variables in your `android/build.gradle` file:
- `useExoplayerIMA` - Enable Google IMA SDK (Ads support)
- `useExoplayerRtsp` - Enable RTSP support
- `useExoplayerSmoothStreaming` - Enable SmoothStreaming support
- `useExoplayerDash` - Enable Dash support
- `useExoplayerHls` - Enable HLS support
Each of these features enabled will increase the size of your APK, so only enable the features you need.
By default enabled features are: `useExoplayerSmoothStreaming` , `useExoplayerDash` , `useExoplayerHls`
Example:
2023-10-26 08:54:14 +02:00
```gradle
buildscript {
ext {
...
2024-04-16 14:23:19 +02:00
useExoplayerIMA = true
useExoplayerRtsp = true
useExoplayerSmoothStreaming = true
useExoplayerDash = true
useExoplayerHls = true
2023-10-26 08:54:14 +02:00
...
}
}
```
2024-05-07 17:25:09 +02:00
See [sample app ](https://github.com/TheWidlarzGroup/react-native-videoo/blob/9c669a2d8a53df36773fd82ff0917280d0659bc7/examples/basic/android/build.gradle#L14C5-L14C5 )
2023-12-23 11:10:04 +01:00
2023-10-26 08:54:14 +02:00
< / details >
< details >
< summary > Windows< / summary >
## Windows
### Autolinking
**React Native Windows 0.63 and above**
Autolinking should automatically add react-native-video to your app.
### Manual Linking
**React Native Windows 0.62**
Make the following additions to the given files manually:
`windows\myapp.sln`
Add the _ReactNativeVideoCPP_ project to your solution (eg. `windows\myapp.sln` ):
1. Open your solution in Visual Studio 2019
2. Right-click Solution icon in Solution Explorer > Add > Existing Project...
3. Select `node_modules\react-native-video\windows\ReactNativeVideoCPP\ReactNativeVideoCPP.vcxproj`
`windows\myapp\myapp.vcxproj`
Add a reference to _ReactNativeVideoCPP_ to your main application project (eg. `windows\myapp\myapp.vcxproj` ):
1. Open your solution in Visual Studio 2019
2. Right-click main application project > Add > Reference...
3. Check _ReactNativeVideoCPP_ from Solution Projects
`pch.h`
Add `#include "winrt/ReactNativeVideoCPP.h"` .
`app.cpp`
Add `PackageProviders().Append(winrt::ReactNativeVideoCPP::ReactPackageProvider());` before `InitializeComponent();` .
**React Native Windows 0.61 and below**
Follow the manual linking instructions for React Native Windows 0.62 above, but substitute _ReactNativeVideoCPP61_ for _ReactNativeVideoCPP_ .
< / details >
< details >
< summary > tvOS< / summary >
## tvOS
`react-native link react-native-video` doesn’ t work properly with the tvOS target so we need to add the library manually.
First select your project in Xcode.

After that, select the tvOS target of your application and select « General » tab

Scroll to « Linked Frameworks and Libraries » and tap on the + button

Select RCTVideo-tvOS

< / details >
< / details >
2024-01-16 07:21:38 +01:00
< details >
< summary > visionOS< / summary >
## visionOS
2024-04-04 13:23:44 +02:00
Run `pod install` in the `visionos` directory of your project
2024-01-16 07:21:38 +01:00
< / details >