kandi background
Explore Kits

react-native-video | A Video / component for reactnative | Video Utils library

 by   react-native-video Java Version: 5.1.1 License: MIT

 by   react-native-video Java Version: 5.1.1 License: MIT

Download this library from

kandi X-RAY | react-native-video Summary

react-native-video is a Java library typically used in Video, Video Utils, React Native applications. react-native-video has no vulnerabilities, it has a Permissive License and it has medium support. However react-native-video has 6 bugs and it build file is not available. You can download it from GitHub.
A
Support
Support
Quality
Quality
Security
Security
License
License
Reuse
Reuse

kandi-support Support

  • react-native-video has a medium active ecosystem.
  • It has 5794 star(s) with 2173 fork(s). There are 105 watchers for this library.
  • It had no major release in the last 12 months.
  • There are 1026 open issues and 885 have been closed. On average issues are closed in 152 days. There are 85 open pull requests and 0 closed requests.
  • It has a neutral sentiment in the developer community.
  • The latest version of react-native-video is 5.1.1
react-native-video Support
Best in #Video Utils
Average in #Video Utils
react-native-video Support
Best in #Video Utils
Average in #Video Utils

quality kandi Quality

  • react-native-video has 6 bugs (1 blocker, 0 critical, 5 major, 0 minor) and 119 code smells.
react-native-video Quality
Best in #Video Utils
Average in #Video Utils
react-native-video Quality
Best in #Video Utils
Average in #Video Utils

securitySecurity

  • react-native-video has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.
  • react-native-video code analysis shows 0 unresolved vulnerabilities.
  • There are 10 security hotspots that need review.
react-native-video Security
Best in #Video Utils
Average in #Video Utils
react-native-video Security
Best in #Video Utils
Average in #Video Utils

license License

  • react-native-video is licensed under the MIT License. This license is Permissive.
  • Permissive licenses have the least restrictions, and you can use them in most projects.
react-native-video License
Best in #Video Utils
Average in #Video Utils
react-native-video License
Best in #Video Utils
Average in #Video Utils

buildReuse

  • react-native-video releases are available to install and integrate.
  • react-native-video has no build file. You will be need to create the build yourself to build the component from source.
  • Installation instructions, examples and code snippets are available.
  • react-native-video saves you 1724 person hours of effort in developing the same functionality from scratch.
  • It has 3819 lines of code, 310 functions and 62 files.
  • It has high code complexity. Code complexity directly impacts maintainability of the code.
react-native-video Reuse
Best in #Video Utils
Average in #Video Utils
react-native-video Reuse
Best in #Video Utils
Average in #Video Utils
Top functions reviewed by kandi - BETA

kandi has reviewed react-native-video and discovered the below as its top functions. This is intended to give you an instant insight into react-native-video implemented functionality, and help decide if they suit your requirements.

  • Adds a zip file to the archive .
  • Set the selected track .
  • Retrieves a cursor of all items in the collection .
  • Perform the resolution to scale the image .
  • Called when a media player is prepared .
  • Reads the timestamp information .
  • Retrieves the list of APK expansion files .
  • Converts an integer value to resize mode .
  • Set the player .
  • Transforms a readable map into a map .

react-native-video Key Features

Version 5 introduces breaking changes on Android, please check carefully the steps described there: Android Installation.

Installation

copy iconCopydownload iconDownload
npm install --save react-native-video

iOS installation

copy iconCopydownload iconDownload
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
+  `pod 'react-native-video', :path => '../node_modules/react-native-video/react-native-video.podspec'`
end

Android installation

copy iconCopydownload iconDownload
include ':react-native-video'
project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android-exoplayer')

react-native-dom installation

copy iconCopydownload iconDownload
import { RNDomInstance } from "react-native-dom";
import { name as appName } from "../app.json";
import RCTVideoManager from 'react-native-video/dom/RCTVideoManager'; // Add this

// Path to RN Bundle Entrypoint ================================================
const rnBundlePath = "./entry.bundle?platform=dom&dev=true";

// React Native DOM Runtime Options =============================================
const ReactNativeDomOptions = {
  enableHotReload: false,
  nativeModules: [RCTVideoManager] // Add this
};

Usage

copy iconCopydownload iconDownload
// Load the module

import Video from 'react-native-video';

// Within your render function, assuming you have a file called
// "background.mp4" in your project. You can include multiple videos
// on a single screen if you like.

<Video source={{uri: "background"}}   // Can be a URL or a local file.
       ref={(ref) => {
         this.player = ref
       }}                                      // Store reference
       onBuffer={this.onBuffer}                // Callback when remote video is buffering
       onError={this.videoError}               // Callback when video cannot be loaded
       style={styles.backgroundVideo} />

// Later on in your styles..
var styles = StyleSheet.create({
  backgroundVideo: {
    position: 'absolute',
    top: 0,
    left: 0,
    bottom: 0,
    right: 0,
  },
});

Configurable props

copy iconCopydownload iconDownload
bufferConfig={{
  minBufferMs: 15000,
  maxBufferMs: 50000,
  bufferForPlaybackMs: 2500,
  bufferForPlaybackAfterRebufferMs: 5000
}}

DRM

copy iconCopydownload iconDownload
source={{
  uri: "https://www.example.com/video.mp4",
  headers: {
    Authorization: 'bearer some-token-value',
    'X-Custom-Header': 'some value'
  }
}}

rate

copy iconCopydownload iconDownload
selectedAudioTrack={{
  type: Type,
  value: Value
}}

Event props

copy iconCopydownload iconDownload
{
  bitrate: 1000000
}

Methods

copy iconCopydownload iconDownload
return (
  <Video source={...}
    ref={ref => (this.player = ref)} />
);

Audio Mixing

copy iconCopydownload iconDownload
#import <AVFoundation/AVFoundation.h>  // import

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  ...
  [[AVAudioSession sharedInstance] setCategory:AVAudioSessionCategoryAmbient error:nil];  // allow
  ...
}

Android Expansion File Usage

copy iconCopydownload iconDownload
zip -r -n .mp4 *.mp4 player.video.example.com

Load files with the RN Asset System

copy iconCopydownload iconDownload
<Video
  source={require('../assets/video/turntable.mp4')}
/>

Examples

copy iconCopydownload iconDownload
git clone git@github.com:react-native-community/react-native-video.git
cd react-native-video/example
npm install
open ios/VideoPlayer.xcodeproj

Version 5.0.0

copy iconCopydownload iconDownload
- distributionUrl=https\://services.gradle.org/distributions/gradle-3.3-all.zip
+ distributionUrl=https\://services.gradle.org/distributions/gradle-5.1.1-all.zip

Version 4.0.0

copy iconCopydownload iconDownload
android {
   ... // Various other settings go here
   compileOptions {
     targetCompatibility JavaVersion.VERSION_1_8
   }
}

Version 3.0.0

copy iconCopydownload iconDownload
// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ... // Various other settings go here
}

allprojects {
    ... // Various other settings go here

    project.ext {
        compileSdkVersion = 23
        buildToolsVersion = "23.0.1"

        minSdkVersion = 16
        targetSdkVersion = 22
    }
}

React-Native video is not playing audio

copy iconCopydownload iconDownload
@import AVFoundation;
#import <AVFoundation/AVFoundation.h>
<Video
    ...
    ignoreSilentSwitch="ignore"
/>
-----------------------
@import AVFoundation;
#import <AVFoundation/AVFoundation.h>
<Video
    ...
    ignoreSilentSwitch="ignore"
/>
-----------------------
@import AVFoundation;
#import <AVFoundation/AVFoundation.h>
<Video
    ...
    ignoreSilentSwitch="ignore"
/>

react native videos in carousel

copy iconCopydownload iconDownload
viewabilityConfig={{viewAreaCoveragePercentThreshold: 200}}
onViewableItemsChanged={this.onViewableItemsChanged}

onViewableItemsChanged = ({ viewableItems, changed }) => {
   if (viewableItems && viewableItems.length > 0) {
        this.setState({ currentVisibleIndex: viewableItems[0].index });
   }
}

componentDidUpdate(prevProps, prevState){
   if (prevProps.currentVisibleIndex !== this.props.currentVisibleIndex) {
         this.setState({ currentVisibleIndex: this.props.currentVisibleIndex }, () => {
            this.onVideoLoad();
         })
         //console.log("Check prevProps: " + prevProps.currentVisibleIndex + "----> Check pevState: " + prevState.currentVisibleIndex);
        }
    }

React Native - Pause Video on Navigation

copy iconCopydownload iconDownload
export default class Player extends Component {
  constructor(props) {
    super(props);

    this.state = {
      paused: props.paused,
      totalLength: 1,
      currentPosition: 0,
      selectedTrack: 0,
      repeatOn: false,
      shuffleOn: false,
    };
  }

  ...

  componentDidUpdate(prevProps, prevState) {
    const { paused } = this.props;
    if (!prevState.paused && paused) {
      this.setState({ paused });
    }
  }

  ...

  render() {
    ...
    const video = this.state.isChanging ? null : (
      <Video
        ...
        paused={this.state.paused}
        ...
      />
    );

    return (
      <View style={styles.container}>
        ...
        {video}
      </View>
    );
  }
}
-----------------------
import React, {useState, useRef} from 'react';

function MainScreen({ navigation }) {
  const [audiostatus, setAudioStatus] = useState(true);

  // create ref
  const playerRef = useRef();

  React.useEffect(() => {
    const unsubscribe = navigation.addListener('blur', () => {
      console.log('Leaving Home Screen');
      setAudioStatus(false); 

      // new code add to pause video from ref
      playerRef.current.pauseVideo();
    });

    return unsubscribe;
  }, [navigation]);

  return (
    <View style={{ flex: 1, justifyContent: 'center',backgroundColor: '#fff' }}>
      <Player ... playerRef={playerRef} />
    </View>
  );
}
import React, {useState, useImperativeHandle, useRef} from 'react';

function Player = (props) => {

  const [paused, setPaused] = useState(props.paused);
  const [totalLength, setTotalLength] = useState(1);
  const [currentPosition, setCurrentPosition] = useState(0);
  const [selectedTrack, setSelectedTrack] = useState(0);
  const [repeatOn, setRepeatOn] = useState(false);
  const [shuffleOn, setShuffleOn] = useState(false);
  const [isChanging, setIsChanging] = useState(false);

  const audioElement = useRef(null);

  const setDuration = (data) => {
    setTotalLength(Math.floor(data.duration));
  }

  const setTime = (data) => {
    setCurrentPosition(Math.floor(data.currentTime));
  }

  const seek = (time) => {
    time = Math.round(time);
    audioElement && audioElement.current.seek(time);
    setCurrentPosition(time);
    setPaused(false);
  }

  const loadStart = () => {}

  // add for accessing ref
  useImperativeHandle(props.playerRef, () => ({
    pauseVideo: () => setPaused(true),
  }));

    const track = props.tracks[selectedTrack];
    const video = isChanging ? null : (
      <Video source={{uri: track.audioUrl}} // Can be a URL or a local file.
        ref={audioElement}
        paused={paused}               // Pauses playback entirely.
        resizeMode="cover"
        ....
        onLoadStart={loadStart} // new added
        onLoad={setDuration} // new added
      />
    );

    return (
      <View style={styles.container}>
        <SeekBar
          onSeek={seek}
          trackLength={totalLength}
          onSlidingStart={() => setPaused(true)}
          currentPosition={currentPosition} />
        <Controls
          onPressPlay={() => setPaused(false) }
          onPressPause={() => setPaused(true)}
          paused={paused}/>
        {video}
      </View>
   );
}
-----------------------
import React, {useState, useRef} from 'react';

function MainScreen({ navigation }) {
  const [audiostatus, setAudioStatus] = useState(true);

  // create ref
  const playerRef = useRef();

  React.useEffect(() => {
    const unsubscribe = navigation.addListener('blur', () => {
      console.log('Leaving Home Screen');
      setAudioStatus(false); 

      // new code add to pause video from ref
      playerRef.current.pauseVideo();
    });

    return unsubscribe;
  }, [navigation]);

  return (
    <View style={{ flex: 1, justifyContent: 'center',backgroundColor: '#fff' }}>
      <Player ... playerRef={playerRef} />
    </View>
  );
}
import React, {useState, useImperativeHandle, useRef} from 'react';

function Player = (props) => {

  const [paused, setPaused] = useState(props.paused);
  const [totalLength, setTotalLength] = useState(1);
  const [currentPosition, setCurrentPosition] = useState(0);
  const [selectedTrack, setSelectedTrack] = useState(0);
  const [repeatOn, setRepeatOn] = useState(false);
  const [shuffleOn, setShuffleOn] = useState(false);
  const [isChanging, setIsChanging] = useState(false);

  const audioElement = useRef(null);

  const setDuration = (data) => {
    setTotalLength(Math.floor(data.duration));
  }

  const setTime = (data) => {
    setCurrentPosition(Math.floor(data.currentTime));
  }

  const seek = (time) => {
    time = Math.round(time);
    audioElement && audioElement.current.seek(time);
    setCurrentPosition(time);
    setPaused(false);
  }

  const loadStart = () => {}

  // add for accessing ref
  useImperativeHandle(props.playerRef, () => ({
    pauseVideo: () => setPaused(true),
  }));

    const track = props.tracks[selectedTrack];
    const video = isChanging ? null : (
      <Video source={{uri: track.audioUrl}} // Can be a URL or a local file.
        ref={audioElement}
        paused={paused}               // Pauses playback entirely.
        resizeMode="cover"
        ....
        onLoadStart={loadStart} // new added
        onLoad={setDuration} // new added
      />
    );

    return (
      <View style={styles.container}>
        <SeekBar
          onSeek={seek}
          trackLength={totalLength}
          onSlidingStart={() => setPaused(true)}
          currentPosition={currentPosition} />
        <Controls
          onPressPlay={() => setPaused(false) }
          onPressPause={() => setPaused(true)}
          paused={paused}/>
        {video}
      </View>
   );
}

Playback Widevine with token from Azure Media Services

copy iconCopydownload iconDownload
 ref={(ref: Video) => { this.video = ref }}
    source={{
      uri: "your mpd url",type: 'mpd', 
      drm: {
        type: 'widevine', 
        licenseServer: 'the Parsed license server form the mpd file',
        headers: {
            'Authorization': 'Bearer=yourtoken'
          }
    }
    }}

React Native playing iOS Slo-mo videos

copy iconCopydownload iconDownload
const [rate,setRate] = useState(1);
const durationRef = useRef();
const checkCurrentTime = useCallback(({currentTime}) => {
  const percentagePlayed = currentTime/durationRef.current;
  setRate(percentagePlayed < 0.1 || percentagePlayed > 0.9 ? 1 : 0.2)
},[durationRef]);

return (
   <Video
     ...
     rate={rate}
     onLoad(({duration}) => durationRef.current = duration)
     onProgress={checkCurrentTime}
   />
)

React Native - Google Fit API can't get steps

copy iconCopydownload iconDownload
scopes: [
   Scopes.FITNESS_ACTIVITY_READ_WRITE,
   Scopes.FITNESS_BODY_READ_WRITE,
],
 scopes: [
    Scopes.FITNESS_ACTIVITY_READ,
    Scopes.FITNESS_ACTIVITY_READ_WRITE,
    Scopes.FITNESS_BODY_READ,
    Scopes.FITNESS_BODY_READ_WRITE,
 ],
-----------------------
scopes: [
   Scopes.FITNESS_ACTIVITY_READ_WRITE,
   Scopes.FITNESS_BODY_READ_WRITE,
],
 scopes: [
    Scopes.FITNESS_ACTIVITY_READ,
    Scopes.FITNESS_ACTIVITY_READ_WRITE,
    Scopes.FITNESS_BODY_READ,
    Scopes.FITNESS_BODY_READ_WRITE,
 ],

How do I pause a playing video (played with react-native-video) when user scrolls to another page in a viewpager (@react-native-community/viewpager)?

copy iconCopydownload iconDownload
<ViewPager
  initialPage={0}
  onPageScroll={({ nativeEvent }) => {
    this.setState({
      activePage: nativeEvent.position
    })
  }
  }>
  <View key="1">
    <Video source={{ uri: '' }}
      paused={this.state.activePage !== 0} />
  </View>
  <View key="2">
    <Video source={{ uri: '' }}
      paused={this.state.activePage !== 1} />
  </View>
</ViewPager>
<ViewPager
  initialPage={0}
  onPageScroll={({ nativeEvent }) => {
    this.setState({
      activePage: nativeEvent.position,
      isPlaying: false
    })
  }
  }>
  <View key="1">
    <Video source={{ uri: '' }}
      paused={!this.state.isPlaying || this.state.activePage !== 0} />
  </View>
  <View key="2">
    <Video source={{ uri: '' }}
      paused={!this.state.isPlaying || this.state.activePage !== 1} />
  </View>
</ViewPager>
-----------------------
<ViewPager
  initialPage={0}
  onPageScroll={({ nativeEvent }) => {
    this.setState({
      activePage: nativeEvent.position
    })
  }
  }>
  <View key="1">
    <Video source={{ uri: '' }}
      paused={this.state.activePage !== 0} />
  </View>
  <View key="2">
    <Video source={{ uri: '' }}
      paused={this.state.activePage !== 1} />
  </View>
</ViewPager>
<ViewPager
  initialPage={0}
  onPageScroll={({ nativeEvent }) => {
    this.setState({
      activePage: nativeEvent.position,
      isPlaying: false
    })
  }
  }>
  <View key="1">
    <Video source={{ uri: '' }}
      paused={!this.state.isPlaying || this.state.activePage !== 0} />
  </View>
  <View key="2">
    <Video source={{ uri: '' }}
      paused={!this.state.isPlaying || this.state.activePage !== 1} />
  </View>
</ViewPager>
-----------------------
<ViewPager
      onPageSelected={this.onPageSelected}
      initialPage={currentVisibleIndex}
      style={{ width: '100%', height: '100%', justifyContent: 'center' }}
      key={data.length}
      // onPageScroll={this.onPageScroll}
      scrollEnabled={data && data.length > 1}
      // onPageScrollStateChanged={this.onPageScrollStateChanged}
    >
      {data.map((item, i) => {
        if (isVideo(item)) {
          return (
            <VideoItem
              uri={item}
              key={i.toString()}
              currentVisibleIndex={currentVisibleIndex}
              currentIndex={i}
            />
          );
        }
        return (
          <ImageItem
            uri={item}
            defaultSource={Images.defaultImageAlbum}
            key={i.toString()}
          />
        );
      })}
    </ViewPager>
  static getDerivedStateFromProps(props, state) {
let { paused } = state;

if (props.currentVisibleIndex !== props.currentIndex) {
  paused = true;
}
return {
  paused,
  currentVisibleIndex: props.currentVisibleIndex
};
-----------------------
<ViewPager
      onPageSelected={this.onPageSelected}
      initialPage={currentVisibleIndex}
      style={{ width: '100%', height: '100%', justifyContent: 'center' }}
      key={data.length}
      // onPageScroll={this.onPageScroll}
      scrollEnabled={data && data.length > 1}
      // onPageScrollStateChanged={this.onPageScrollStateChanged}
    >
      {data.map((item, i) => {
        if (isVideo(item)) {
          return (
            <VideoItem
              uri={item}
              key={i.toString()}
              currentVisibleIndex={currentVisibleIndex}
              currentIndex={i}
            />
          );
        }
        return (
          <ImageItem
            uri={item}
            defaultSource={Images.defaultImageAlbum}
            key={i.toString()}
          />
        );
      })}
    </ViewPager>
  static getDerivedStateFromProps(props, state) {
let { paused } = state;

if (props.currentVisibleIndex !== props.currentIndex) {
  paused = true;
}
return {
  paused,
  currentVisibleIndex: props.currentVisibleIndex
};

Is it possible to buffer an audio file right before play on react-native-video?

copy iconCopydownload iconDownload
const urls = await ytdl(youtubeURL, { filter: format => format.container === 'mp4' , quality: 'highestaudio', highWaterMark: 1024 * 1024 * 14 });

React Native - TypeError: Cannot read property 'clean' of undefined

copy iconCopydownload iconDownload
module.exports = {
  dependencies: {
    'react-native-image-filter-kit': {
      platforms: {
        android: null, // disable Android platform, other platforms will still autolink if provided
      },
    },
}

TypeError: null is not an object (evaluating 'Chat.addListener')

copy iconCopydownload iconDownload
react-native link quickblox-react-native-sdk --platforms ios

Community Discussions

Trending Discussions on react-native-video
  • CocoaPods could not find compatible versions for pod &quot;Firebase/Everything&quot;
  • How to Display Video with React native
  • Distortion in react-native-video
  • How to solved error - Trying to load empty source in react native video
  • How can I access my videos from internal storage with react native video?
  • React-Native video is not playing audio
  • react native videos in carousel
  • Get path of a PHAsset coming from CameraRoll iOS with react native
  • react native video fullscreen controll
  • React Native - Pause Video on Navigation
Trending Discussions on react-native-video

QUESTION

CocoaPods could not find compatible versions for pod &quot;Firebase/Everything&quot;

Asked 2021-May-22 at 10:44

I am getting this error when I am trying to run my React Native app in iOS:

[!] CocoaPods could not find compatible versions for pod "Firebase/Auth":
  In Podfile:
    Firebase/Auth

    RNFBAuth (from `../node_modules/@react-native-firebase/auth`) was resolved to 10.5.1, which depends on
      Firebase/Auth (~> 7.4.0)

CocoaPods could not find compatible versions for pod "Firebase/CoreOnly":
  In Podfile:
    Firebase/Crash was resolved to 5.0.0, which depends on
      Firebase/Core (= 5.0.0) was resolved to 5.0.0, which depends on
        Firebase/CoreOnly (= 5.0.0)

    RNFBApp (from `../node_modules/@react-native-firebase/app`) was resolved to 10.5.0, which depends on
      Firebase/CoreOnly (~> 7.4.0)

    RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on
      Firebase/Database (~> 7.4.0) was resolved to 7.4.0, which depends on
        Firebase/CoreOnly (= 7.4.0)

CocoaPods could not find compatible versions for pod "Firebase/Database":
  In Podfile:
    Firebase/Database

    RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on
      Firebase/Database (~> 7.4.0)

CocoaPods could not find compatible versions for pod "Firebase/Firestore":
  In Podfile:
    Firebase/Firestore

    RNFBFirestore (from `../node_modules/@react-native-firebase/firestore`) was resolved to 10.5.1, which depends on
      Firebase/Firestore (~> 7.4.0)

CocoaPods could not find compatible versions for pod "Firebase/Messaging":
  In Podfile:
    Firebase/Messaging

    RNFBMessaging (from `../node_modules/@react-native-firebase/messaging`) was resolved to 10.5.1, which depends on
      Firebase/Messaging (~> 7.4.0)

CocoaPods could not find compatible versions for pod "Firebase/Storage":
  In Podfile:
    Firebase/Storage

    RNFBStorage (from `../node_modules/@react-native-firebase/storage`) was resolved to 10.5.1, which depends on
      Firebase/Storage (~> 7.4.0)

CocoaPods could not find compatible versions for pod "FirebaseCore":
  In Podfile:
    Firebase/Crash was resolved to 3.9.0, which depends on
      Firebase/Core (= 3.9.0) was resolved to 3.9.0, which depends on
        FirebaseCore (= 3.4.4)

    RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on
      Firebase/Database (~> 7.4.0) was resolved to 7.4.0, which depends on
        Firebase/CoreOnly (= 7.4.0) was resolved to 7.4.0, which depends on
          FirebaseCore (= 7.4.0)

    RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on
      Firebase/Database (~> 7.4.0) was resolved to 7.4.0, which depends on
        FirebaseDatabase (~> 7.4.0) was resolved to 7.4.0, which depends on
          FirebaseCore (~> 7.0)

CocoaPods could not find compatible versions for pod "FirebaseInstanceID":
  In Podfile:
    Firebase/Crash was resolved to 3.2.0, which depends on
      FirebaseCrash (= 1.0.4) was resolved to 1.0.4, which depends on
        FirebaseInstanceID (~> 1.0)

    RNFBMessaging (from `../node_modules/@react-native-firebase/messaging`) was resolved to 10.5.1, which depends on
      Firebase/Messaging (~> 7.4.0) was resolved to 7.4.0, which depends on
        FirebaseMessaging (~> 7.4.0) was resolved to 7.4.0, which depends on
          FirebaseInstanceID (~> 7.0)

My package.json is:

{
  "name": "prueba3000",
  "version": "1.1.0",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "eslint": "eslint **/*.tsx **/*.ts",
    "build-testing": "cd android && ./gradlew assembleRelease",
    "build-android": "cd android && ./gradlew bundleRelease",
    "clean": "cd android && ./gradlew clean",
    "postinstall": "npx jetify"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@fortawesome/react-native-fontawesome": "^0.2.3",
    "@react-native-community/async-storage": "^1.9.0",
    "@react-native-community/clipboard": "^1.5.1",
    "@react-native-community/datetimepicker": "^3.0.8",
    "@react-native-community/geolocation": "^2.0.2",
    "@react-native-community/hooks": "^2.6.0",
    "@react-native-community/image-editor": "^2.3.0",
    "@react-native-community/masked-view": "^0.1.7",
    "@react-native-community/slider": "^3.0.3",
    "@react-native-firebase/app": "^10.5.0",
    "@react-native-firebase/auth": "^10.5.1",
    "@react-native-firebase/database": "^10.5.1",
    "@react-native-firebase/firestore": "^10.5.1",
    "@react-native-firebase/messaging": "^10.5.1",
    "@react-native-firebase/storage": "^10.5.1",
    "@react-navigation/native": "^5.1.3",
    "@react-navigation/stack": "^5.2.6",
    "@types/bcrypt": "^3.0.0",
    "bcrypt": "^5.0.0",
    "json2formdata": "^1.0.4",
    "lottie-ios": "^3.1.3",
    "lottie-react-native": "^3.3.2",
    "moment": "^2.24.0",
    "object-to-formdata": "^4.1.0",
    "react": "17.0.1",
    "react-native": "^0.63.4",
    "react-native-camera": "^3.31.0",
    "react-native-countdown-component": "^2.7.1",
    "react-native-device-info": "^7.3.1",
    "react-native-document-picker": "^4.1.0",
    "react-native-fs": "^2.16.6",
    "react-native-gesture-handler": "^1.9.0",
    "react-native-gifted-chat": "^0.16.3",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-modal-datetime-picker": "^9.1.0",
    "react-native-progress": "^4.1.2",
    "react-native-reanimated": "^2.0.0-alpha.9.2",
    "react-native-safe-area-context": "^3.1.9",
    "react-native-screens": "^2.4.0",
    "react-native-splash-screen": "^3.2.0",
    "react-native-svg": "^12.0.3",
    "react-native-video": "^5.1.0-alpha8",
    "react-native-video-controls": "^2.6.0",
    "rn-fetch-blob": "^0.12.0",
    "sprintf-js": "^1.1.2",
    "tipsi-stripe": "^7.5.3"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/plugin-proposal-optional-chaining": "^7.9.0",
    "@babel/runtime": "^7.8.7",
    "@react-native-community/eslint-config": "^2.0.0",
    "@svgr/cli": "^5.2.0",
    "@types/jest": "^26.0.16",
    "@types/react": "^17.0.0",
    "@types/react-native": "^0.63.37",
    "@types/react-test-renderer": "^17.0.0",
    "@typescript-eslint/eslint-plugin": "^4.9.0",
    "@typescript-eslint/parser": "^4.9.0",
    "babel-eslint": "^10.1.0",
    "babel-jest": "^26.6.3",
    "eslint": "^7.15.0",
    "eslint-config-airbnb": "^18.1.0",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-react": "^7.19.0",
    "faker": "^5.1.0",
    "jest": "^26.6.3",
    "jest-transform-stub": "^2.0.0",
    "jetifier": "^1.6.6",
    "metro-react-native-babel-preset": "^0.64.0",
    "react-test-renderer": "17.0.1",
    "typescript": "^4.1.2"
  },
  "jest": {
    "preset": "react-native"
  },
  "type": "module"
}

In my Podfile, I have this: platform :ios, '10.1' And I have tried also with 10.0 and 9.0.

I have run: pod install npx pod install pod install --repo-update and pod update Firebase/core.

When running pod update Firebase/core I got this error: [!] No `Podfile.lock' found in the project directory, run `pod install'.. But I can't do pod install.

If anyone could give a gint of how solve this, I would really appreciate that. Thanks!

ANSWER

Answered 2021-Feb-02 at 20:08

run command from the project root folder.

if npm

rm -rf node_modules package-lock.json

if yarn

rm -rf node_modules yarn.lock

remove ^ from every package

set package version from the concerned library if that version exists then ok, otherwise set version that actually exists

run command

npm install or yarn install

then

cd ios

run command from ios folder

rm -rf Pods Podfile.lock

then

pod install

Source https://stackoverflow.com/questions/66016300

Community Discussions, Code Snippets contain sources that include Stack Exchange Network

Vulnerabilities

No vulnerabilities reported

Install react-native-video

Then follow the instructions for your platform to link react-native-video into your project:.
Run npx pod-install. Linking is not required in React Native 0.60 and above. Run react-native link react-native-video to link the react-native-video library. Setup your Podfile like it is described in the react-native documentation.
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.
Linking is not required in React Native 0.60 and above. If your project is using React Native < 0.60, run react-native link react-native-video to link the react-native-video library.
Autolinking should automatically add react-native-video to your app.
Open your solution in Visual Studio 2019
Right-click Solution icon in Solution Explorer > Add > Existing Project...
Select node_modules\react-native-video\windows\ReactNativeVideoCPP\ReactNativeVideoCPP.vcxproj
Open your solution in Visual Studio 2019
Right-click main application project > Add > Reference...
Check ReactNativeVideoCPP from Solution Projects
Make the following additions to the given files manually:.

Support

For any new features, suggestions and bugs create an issue on GitHub. If you have any questions check and ask questions on community page Stack Overflow .

DOWNLOAD this Library from

Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from
over 430 million Knowledge Items
Find more libraries
Reuse Solution Kits and Libraries Curated by Popular Use Cases

Save this library and start creating your kit

Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from
over 430 million Knowledge Items
Find more libraries
Reuse Solution Kits and Libraries Curated by Popular Use Cases

Save this library and start creating your kit

  • © 2022 Open Weaver Inc.