iosreact-nativereact-native-track-player

React Native Track Player ios Troubleshooting building 100%


I'm developing a React Native app using react-native-track-player for audio playback. The app works perfectly fine on Android, but I'm facing issues on iOS. Specifically, when building and running the app, it freezes at "Building 100%" and eventually crashes with the following error:

com.facebook.react.runtime.JavaScript (9): EXC_BAD_ACCESS (code=1, address=0x0)

Screenshot enter image description here

The error occurs when i add

await TrackPlayer.setupPlayer(); 

to the code.

This is my code :

import React, { useEffect } from 'react';
import { View, Button } from 'react-native';
import TrackPlayer,{ Capability } from 'react-native-track-player';

const AudioPlayer: React.FC = () => {
  useEffect(() => {
    const setupPlayer = async () => {
      await TrackPlayer.setupPlayer();

      // Ajout de la piste
      const audioPath = require('../../assets/audio/teddy.mp3');
      await TrackPlayer.add({
        id: 'trackId',
        url: audioPath,
        title: 'Teddy Audio',
        artist: 'Inconnu',
        artwork: 'https://www.example.com/artwork.jpg',
      });

      // Configure les contrĂ´les de notification
      TrackPlayer.updateOptions({
        
        capabilities: [
          Capability.Play,
          Capability.Pause,
          Capability.Stop,
        ],
        compactCapabilities: [
          Capability.Play,
          Capability.Pause,
        ],
        notificationCapabilities: [
          Capability.Play,
          Capability.Pause,
          Capability.Stop,
        ],
      });
    };

    setupPlayer();

    return () => {
      TrackPlayer.stop();
    };
  }, []);

  const playAudio = async () => {
    await TrackPlayer.play();
  };

  const pauseAudio = async () => {
    await TrackPlayer.pause();
  };

  return (
    <View>
      <Button title="Lire l'audio" onPress={playAudio} />
      <Button title="Pause" onPress={pauseAudio} />
    </View>
  );
};

export default AudioPlayer;

Has anyone else experienced a similar issue or found a solution?

Here is what I have tried so far:

  1. Wrapped the setup in a try-catch block to capture any potential errors.
  2. Verified compatibility with my React Native and react-native-track-player versions.
  3. Ensured necessary permissions and configurations are set for Android and iOS.
  4. add dummy.swift file

Solution

  • I figured out the issue I was facing on iOS, and it was caused by the new architecture being enabled by default with React Native. Apparently, it creates compatibility issues with certain modules, especially those related to Hermes or other specific configurations.

    To resolve this, I had to disable the new architecture on iOS by using the following command:

    RCT_NEW_ARCH_ENABLED=0 pod install
    

    After running this command, everything worked perfectly again. If anyone else is having the same issue, give this a try! It really solved the problem for me.đŸ†—