2

I have an react-native expo managed (SDK 44) project and am attempting to add react-native-track-player.I am going through the installation steps and keep encountering the same error that is crashing the app:

TypeError: null is not an object (evaluating ‘TrackPlayer.RATING_HEART’)

I am using eas build to run the app using expo start --dev-client on an android device. I have not tested on ios yet.

Here is my code:

App.tsx

import TrackPlayer, {Capability} from 'react-native-track-player';

async function setup() {
  await TrackPlayer.setupPlayer({});
  await TrackPlayer.updateOptions({
    stopWithApp: false,
    capabilities: [
      TrackPlayer.CAPABILITY_PLAY,
      TrackPlayer.CAPABILITY_PAUSE,
      TrackPlayer.CAPABILITY_STOP,
      TrackPlayer.CAPABILITY_SEEK_TO,
    ],
    compactCapabilities: [
      TrackPlayer.CAPABILITY_PLAY,
      TrackPlayer.CAPABILITY_PAUSE,
    ],
  });
}

export default function App() {
...
  useEffect(() => {
    setup();

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

index.js

import { registerRootComponent } from "expo"
import App from "./App"
import TrackPlayer from "react-native-track-player"

registerRootComponent(App)
TrackPlayer.registerPlaybackService(() => require("./service.js"))

service.js

import TrackPlayer from 'react-native-track-player';

module.exports = async function () {
  TrackPlayer.addEventListener('remote-play', () => {
    console.log('remote play clicked');
    TrackPlayer.play();
  });

  TrackPlayer.addEventListener('remote-pause', () => {
    console.log('remote pause clicked');
    TrackPlayer.pause();
  });

  TrackPlayer.addEventListener('remote-next', () => {
    TrackPlayer.skipToNext();
  });

  TrackPlayer.addEventListener('remote-previous', () => {
    TrackPlayer.skipToPrevious();
  });

  TrackPlayer.addEventListener('remote-stop', () => {
    TrackPlayer.destroy();
  });

  TrackPlayer.addEventListener('remote-seek', ({ position }) => {
    // TrackPlayer.destroy();
    console.log('remote seek:', position);
    TrackPlayer.seekTo(position);
  });
};

package.json

...
"main": "./index.js",
"dependencies": {
    ""react-native-track-player": "3.0.0",
"expo": "^44.0.6",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",

}

app.json

"expo": {
    ...
    "entryPoint": "./index.js",
}

So far, I have tried:

-clearing my cache and reinstalling react-native-track-player

-adding jcenter() to my build.gradle file (as described here)

-i have tried this, but am not sure I configured it properly

I have not tried ejecting Expo as I am trying to avoid that for now. Does anyone know why this might be happening?

2 Answers 2

1

Please check this github issue it seems like react native track players does not work on expo gosee the github issue

Update:

You can always create a development build and use this library on expo without any issue expo doc

Sign up to request clarification or add additional context in comments.

Comments

0

react-native-track-player does not work with expo go.

Have you followed the instructions for using expo-dev-client. Have you imported it? I don't see expo-dev-client in your dependencies.

My recommendation would be to follow the expo documentation for building with expo-dev-client.https://docs.expo.dev/develop/development-builds/installation/

When I did that, it automatically updated my package.json to include the expo-dev-client.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.