New Architecture Support

[MoamberRaza]

some how i dont know currently app is crashing when i come to foreground using react native 78.1 with appdelegate.swift is this happening to someone else. will this lib has support for new architecture.

[jspizziri]

@MoamberRaza new arch will eventually be supported, but currently is not

[praisedavid787]

You can try my fork in the mean time. Full support for the new arch on iOS and android. Compatible with RN v0.76.6. Haven’t tested with lower or higher. You can access it here. Don't hesitate to reach out if you can't get it working in your project. @jspizziri how are you by the way? Been a long while yh 🙂

[oiver555]

Oh I didn't know there was a fork out there that allowed for new Arch, will give it a shot

[abdulragib]

You can try my fork in the mean time. Full support for the new arch on iOS and android. Compatible with RN v0.76.6. Haven’t tested with lower or higher. You can access it here. Don't hesitate to reach out if you can't get it working in your project. @jspizziri how are you by the way? Been a long while yh 🙂

how to use your repo so that i can enable new arch in my project, please help

[praisedavid787]

Sorry for the late reply. I’ll send you the setup in a minute.

On Wed, 2 Apr 2025 at 18:08, Abdul Ragib @.***> wrote:

You can try my fork in the mean time. Full support for the new arch on iOS and android. Compatible with RN v0.76.6. Haven’t tested with lower or higher. You can access it here https://github.com/praisedavid787/react-native-track-player/tree/feat/turbomodule. Don't hesitate to reach out if you can't get it working in your project. @jspizziri https://github.com/jspizziri how are you by the way? Been a long while yh 🙂

how to use your repo so that i can enable new arch in my project, please help

— Reply to this email directly, view it on GitHub https://github.com/doublesymmetry/react-native-track-player/issues/2443#issuecomment-2773211759, or unsubscribe https://github.com/notifications/unsubscribe-auth/AMI66NESWXZ6GPCVWON42KT2XQKSNAVCNFSM6AAAAABZ2RJILOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDONZTGIYTCNZVHE . You are receiving this because you commented.Message ID: @.*** com> [image: abdulragib]abdulragib left a comment (doublesymmetry/react-native-track-player#2443) https://github.com/doublesymmetry/react-native-track-player/issues/2443#issuecomment-2773211759

You can try my fork in the mean time. Full support for the new arch on iOS and android. Compatible with RN v0.76.6. Haven’t tested with lower or higher. You can access it here https://github.com/praisedavid787/react-native-track-player/tree/feat/turbomodule. Don't hesitate to reach out if you can't get it working in your project. @jspizziri https://github.com/jspizziri how are you by the way? Been a long while yh 🙂

how to use your repo so that i can enable new arch in my project, please help

— Reply to this email directly, view it on GitHub https://github.com/doublesymmetry/react-native-track-player/issues/2443#issuecomment-2773211759, or unsubscribe https://github.com/notifications/unsubscribe-auth/AMI66NESWXZ6GPCVWON42KT2XQKSNAVCNFSM6AAAAABZ2RJILOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDONZTGIYTCNZVHE . You are receiving this because you commented.Message ID: @.*** com>

[praisedavid787]

Quite a hack but follow closely now. Firstly clone my fork in the same folder as your project. Not in the root of your project pls. In the clone, checkout to branch feat/turbomodule and run yarn to install deps. After that run yarn prepare. Then in your project's react-native.config.js, find a way to integrate this in:

const path = require('path');

module.exports = {
   project: {
     // ios: {
       // automaticPodsInstallation: true,
     // },
   },
   dependencies: {
     "react-native-track-player": {
       root: path.join(__dirname, '../react-native-track-player'),
     },
   },
};

Then in your metroConfig:

... // imports
const { getConfig } = require('./getConfig');
// const {wrapWithReanimatedMetroConfig} = require('react-native-reanimated/metro-config'); // uncomment if using reanimated
... 
module.exports = getConfig(
//  wrapWithReanimatedMetroConfig(mergeConfig(defaultConfig, config)), // uncomment if using reanimated
  mergeConfig(defaultConfig, config), // comment if using reanimated
  {
    root: __dirname,
    localLibs: [
      '../react-native-track-player',
    ]
  }
);

Then in project root add file getConfig.js and insert:

const path = require('path');
const escape = require('escape-string-regexp');
const exclusionList = require('metro-config/src/defaults/exclusionList');

/**
 * Get Metro configuration for a project using local libraries.
 *
 * @param {import('metro-config').MetroConfig} defaultConfig Default Metro configuration
 * @param {object} options Options for customization
 * @param {string} options.root Root directory of the project
 * @param {string[]} options.localLibs Array of relative paths to local libraries
 * @returns {import('metro-config').MetroConfig} Metro configuration
 */
const getConfig = (defaultConfig, { root, localLibs }) => {
  const resolvedLibs = localLibs.map((lib) => path.resolve(root, lib));

  // Create exclusion rules for each library
  const blacklistPatterns = resolvedLibs.flatMap((lib) => [
    // Block `react-native` inside the library's node_modules
    new RegExp(`^${escape(path.join(lib, 'node_modules/react-native'))}\\/.*$`),
    // Block other shared peer dependencies inside the library's node_modules
    ...Object.keys(require(path.join(lib, 'package.json')).peerDependencies || {}).map(
      (dep) =>
        new RegExp(`^${escape(path.join(lib, 'node_modules', dep))}\\/.*$`)
    ),
  ]);

  const nodeModules = resolvedLibs.reduce((acc, lib) => {
    const libName = require(path.join(lib, 'package.json')).name;
    acc[libName] = lib;
  
    const peerDeps = Object.keys(require(path.join(lib, 'package.json')).peerDependencies || {});
    peerDeps.forEach((dep) => {
      acc[dep] = path.join(root, 'node_modules', dep);
    });
  
    return acc;
  }, {});

  return {
    ...defaultConfig,
    projectRoot: root,
    watchFolders: resolvedLibs,
    resolver: {
      ...defaultConfig.resolver,
      blacklistRE: exclusionList(blacklistPatterns),
      extraNodeModules: nodeModules,
    },
  };
};

module.exports = { getConfig };

And lastly, for android builds to work; in android/app/build.gradle add at the bottom:

// Since our library doesn't invoke codegen automatically we need to do it here.
tasks.register('invokeLibraryCodegenTP', Exec) {
    workingDir "$rootDir/../../react-native-track-player"
    def isWindows = System.getProperty('os.name').toLowerCase().contains('windows')

    if (isWindows) {
        commandLine 'cmd', '/c', 'npx bob build --target codegen'
    } else {
        commandLine 'sh', '-c', 'npx bob build --target codegen'
    }
}
preBuild.dependsOn invokeLibraryCodegenTP

Then for iOS, just install pods with new arch enabled, i.e, cd ios && RCT_NEW_ARCH_ENABLED=1 bundle exec pod install && cd ... 👍🏽

[praisedavid787]

No need to add to deps in your project's package.json.

[MoamberRaza]

@MoamberRaza new arch will eventually be supported, but currently is not

Any update on this.

[basitmir]

Hey @jspizziri , do you have any idea when support for the new architecture might be expected? If it's not on the radar anytime soon, feel free to let us know that too — would help with planning.

CC : @dcvz @puckey @Guichaguri @curiousdustin

[jonluca]

I've published a fix + a couple more fixes at https://www.npmjs.com/package/@weights-ai/react-native-track-player and https://github.com/weights-ai/react-native-track-player for now - will gladly take them down if this library gets a new maintainer or has more upstream fixes merged in.

[basitmir]

I've published a fix + a couple more fixes at https://www.npmjs.com/package/@weights-ai/react-native-track-player and https://github.com/weights-ai/react-native-track-player for now - will gladly take them down if this library gets a new maintainer or has more upstream fixes merged in.

I tried using this, but it doesn't seem to be working — the app hangs at the line await TrackPlayer.setupPlayer();. I'm importing it like this: import TrackPlayer from '@weights-ai/react-native-track-player';

is there anything else that needs to be done ?

i am currently using "react-native": "^0.77.0",

@jonluca

[RainPlays09]

Quite a hack but follow closely now. Firstly clone my fork in the same folder as your project. Not in the root of your project pls. In the clone, checkout to branch feat/turbomodule and run yarn to install deps. After that run yarn prepare. Then in your project's react-native.config.js, find a way to integrate this in:

const path = require('path');

module.exports = { project: { // ios: { // automaticPodsInstallation: true, // }, }, dependencies: { "react-native-track-player": { root: path.join(__dirname, '../react-native-track-player'), }, }, }; Then in your metroConfig:

... // imports const { getConfig } = require('./getConfig'); // const {wrapWithReanimatedMetroConfig} = require('react-native-reanimated/metro-config'); // uncomment if using reanimated ... module.exports = getConfig( // wrapWithReanimatedMetroConfig(mergeConfig(defaultConfig, config)), // uncomment if using reanimated mergeConfig(defaultConfig, config), // comment if using reanimated { root: __dirname, localLibs: [ '../react-native-track-player', ] } ); Then in project root add file getConfig.js and insert:

const path = require('path'); const escape = require('escape-string-regexp'); const exclusionList = require('metro-config/src/defaults/exclusionList');

/**

• Get Metro configuration for a project using local libraries.
• @param {import('metro-config').MetroConfig} defaultConfig Default Metro configuration
• @param {object} options Options for customization
• @param {string} options.root Root directory of the project
• @param {string[]} options.localLibs Array of relative paths to local libraries
• @returns {import('metro-config').MetroConfig} Metro configuration */ const getConfig = (defaultConfig, { root, localLibs }) => { const resolvedLibs = localLibs.map((lib) => path.resolve(root, lib));

// Create exclusion rules for each library const blacklistPatterns = resolvedLibs.flatMap((lib) => [ // Block react-native inside the library's node_modules new RegExp(^${escape(path.join(lib, 'node_modules/react-native'))}\\/.*$), // Block other shared peer dependencies inside the library's node_modules ...Object.keys(require(path.join(lib, 'package.json')).peerDependencies || {}).map( (dep) => new RegExp(^${escape(path.join(lib, 'node_modules', dep))}\\/.*$) ), ]);

const nodeModules = resolvedLibs.reduce((acc, lib) => { const libName = require(path.join(lib, 'package.json')).name; acc[libName] = lib;

const peerDeps = Object.keys(require(path.join(lib, 'package.json')).peerDependencies || {});
peerDeps.forEach((dep) => {
  acc[dep] = path.join(root, 'node_modules', dep);
});

return acc;

}, {});

return { ...defaultConfig, projectRoot: root, watchFolders: resolvedLibs, resolver: { ...defaultConfig.resolver, blacklistRE: exclusionList(blacklistPatterns), extraNodeModules: nodeModules, }, }; };

module.exports = { getConfig }; And lastly, for android builds to work; in android/app/build.gradle add at the bottom:

// Since our library doesn't invoke codegen automatically we need to do it here. tasks.register('invokeLibraryCodegenTP', Exec) { workingDir "$rootDir/../../react-native-track-player" def isWindows = System.getProperty('os.name').toLowerCase().contains('windows')

if (isWindows) {
    commandLine 'cmd', '/c', 'npx bob build --target codegen'
} else {
    commandLine 'sh', '-c', 'npx bob build --target codegen'
}

} preBuild.dependsOn invokeLibraryCodegenTP Then for iOS, just install pods with new arch enabled, i.e, cd ios && RCT_NEW_ARCH_ENABLED=1 bundle exec pod install && cd ... 👍🏽

Hello👋 @praisedavid787 , how do I use it in expo project??

[praisedavid787]

Hi @RainPlays09 , unfortunately I don’t run an expo project and haven’t explored that compatibility.

[c-goettert]

This problem should be prioritised to keep this (really helpful) library alive. What about the related pull request, is there any plan when it will get merged?

[subvertallchris]

+1, looking forward to this update.

[mycloudvip]

Puzzled to see this amazing library which has not been made compliant with the new architecture and Expo SDK 53+

Any tentative release date?

[MoamberRaza]

i am seeing there is an new update - 4.1.1 will it have new arch support.

[MoamberRaza]

any luck

[MoamberRaza]

People are seeking reply. Please provide any ETA. anyone here who has solution with NewArch Enabled. Please help me out here.

[jspizziri]

I'm closing this issue as it's a duplicate of https://github.com/doublesymmetry/react-native-track-player/issues/2425

New Arch will be added once a PR is submitted, reviewed, merged and released. That requires effort. Please do not come to tickets and just say "I want this, when is it going to be ready?". Instead, contribute code and time moving things forward.