Build Issues with latest React Native template

[sikemullivan]

Version of react-native-audio-recorder-player

3.5.1

Version of React Native

0.70.4

Platforms you faced the error (IOS or Android or both?)

both

Expected behavior

It should build.

Actual behavior

Build errors

Steps to reproduce the behavior

• Create new React Native Typescript Project npx react-native init AwesomeTSProject --template react-native-template-typescript
• Follow this projects installation steps
• Observe build errors on both Android and iOS

Android - compile is no longer a key word in the latest versions of Gradle

error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.
Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=8081

FAILURE: Build failed with an exception.

* Where:
Build file '/Users/me/repos/myproject/play/android/app/build.gradle' line: 280

* What went wrong:
A problem occurred evaluating project ':app'.
> Could not find method compile() for arguments [project ':react-native-audio-recorder-player'] on object of type org.gradle.api.internal.artifacts.dsl.dependencies.DefaultDependencyHandler.

iOS - The instructions are not very clear on setting up Swift integration. I added a Swift file to the project and observed the Bridge Header section appearing. Beyond that, it's not clear what I should do.

Building from xcode /Users/me/repos/myproject/play/node_modules/react-native-audio-recorder-player/ios/RNAudioRecorderPlayer.m:1:9 'React/RCTBridgeModule.h' file not found Build via npx react-native run-ios

The following build commands failed:
        CompileC /Users/me/Library/Developer/Xcode/DerivedData/play-asdfasdf/Build/Intermediates.noindex/RNAudioRecorderPlayer.build/Debug-iphonesimulator/RNAudioRecorderPlayer.build/Objects-normal/x86_64/RNAudioRecorderPlayer.o /Users/me/repos/myproject/play/node_modules/react-native-audio-recorder-player/ios/RNAudioRecorderPlayer.m normal x86_64 objective-c com.apple.compilers.llvm.clang.1_0.compiler (in target 'RNAudioRecorderPlayer' from project 'RNAudioRecorderPlayer')
(1 failure)

[sikemullivan]

For iOS, the installation is much easier than the documented installation instructions. All you need to do is add a Swift file to the project in XCode. No need to link the the project.

[sikemullivan]

For Android, Step 1 can be removed and Step 3 should use implementation and not compile. Compile has been removed from gradle.

3. Insert the following lines inside the dependencies block in android/app/build.gradle:

  implementation project(':react-native-audio-recorder-player')

[hyochan]

Thanks for sharing your problem @sikemullivan .

The manual installation is a pretty old approach which is for users using React Native version below 0.60. Mostly, automatic installation and post installation is what you need.

[sikemullivan]

@hyochan I was able to fix my issues doing what I described in the comments above. I figured I would leave it open if you wanted to update the documentation. You can close the issue if you feel like it's unnecessary. I figured at least posting this issue may help someone else that runs into the same problem.

[Srijan67]

I tried what you suggested @sikemullivan but still for it it is throwing same error, //Error Deprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.

You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.

See https://docs.gradle.org/7.5.1/userguide/command_line_interface.html#sec:command_line_warnings 5 actionable tasks: 5 executed

FAILURE: Build completed with 2 failures.

1: Task failed with an exception.

• Where: Build file 'E:\Projects\Syscorp\node_modules\react-native-audio-recorder-player\android\build.gradle' line: 23

• What went wrong: A problem occurred evaluating project ':react-native-audio-recorder-player'.

Plugin with id 'kotlin-android' not found.

• Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. ==============================================================================

2: Task failed with an exception.

• What went wrong: A problem occurred configuring project ':react-native-audio-recorder-player'.

compileSdkVersion is not specified. Please add it to build.gradle

• Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. ==============================================================================

• Get more help at https://help.gradle.org

BUILD FAILED in 1m 33s

This is my android/app/build.gradle file dependencies: //Dependencies dependencies { implementation fileTree(dir: "libs", include: ["*.jar"])

//noinspection GradleDynamicVersion
implementation "com.facebook.react:react-native:+"  // From node_modules

implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
implementation project(':react-native-audio-recorder-player')
debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
    exclude group:'com.facebook.fbjni'
}

[sikemullivan]

@Srijan67 what version of React Native are you on?

[Srijan67]

@Srijan67 what version of React Native are you on?

React Native version 70.6

[pradipbhanderi]

i have same problem

[hyochan]

Could anyone please try the example project which also has the latest build?

[jforaker]

Can confirm adding this package breaks Android on a fresh init of the current react-native architecture (0.71.4)

1: Task failed with an exception.
-----------
* Where:
Build file '/Users/me/dev/rntester/app/node_modules/react-native-audio-recorder-player/android/build.gradle' line: 23

* What went wrong:
A problem occurred evaluating project ':react-native-audio-recorder-player'.
> Plugin with id 'kotlin-android' not found.

[hectorleiva]

@jforaker

This workaround (https://github.com/react-native-webview/react-native-webview/issues/1407#issuecomment-634436481) seems to have helped in at least getting my RN Project compiling properly for Android:

package.json

    "react": "18.2.0",
    "react-native": "0.71.7",
    "react-native-audio-recorder-player": "^3.5.3",

android/build.gradle

buildscript {
    repositories {
        // adding google() here to update to gradle 3
        google()
        mavenCentral()
    }
    dependencies {
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
        classpath('com.android.tools.build:gradle:7.3.1')
        classpath("com.facebook.react:react-native-gradle-plugin")
        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:1.5.31")
    }
}

Adding the following in android/build.gradle seems to be key. The version of kotlin-gradle-plugin was one that CoPilot recommended and it works for me at the moment.

classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:1.5.31")

[jforaker]

This workaround (react-native-webview/react-native-webview#1407 (comment)) seems to have helped in at least getting my RN Project compiling properly for Android:

Thanks @hectorleiva. I've eventually got it working but I don't remember which was the magic step for this library. My app has a bunch of native modules and we did a massive upgrade to [email protected] so it was a sweeping change to get everything working.

Here's my android/build.gradle in case it helps anyone:

buildscript {
    ext {
        buildToolsVersion = "33.0.0"
        minSdkVersion = 28
        compileSdkVersion = 33
        targetSdkVersion = 33

        kotlinVersion = "1.7.0"

        // We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
        ndkVersion = "23.1.7779620"
    }
    repositories {
        google()
        mavenCentral()
        jcenter()
    }
    dependencies {
        classpath("com.android.tools.build:gradle:7.3.1")
        classpath("com.facebook.react:react-native-gradle-plugin")
        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlinVersion")
    }
}

package.json:

"react-native-audio-recorder-player": "3.5.3"

[gsudhanshu]

@hyochan I am facing build issues in iOS

react native 0.71.1 RNAudioRecorderPlayer 3.5.3

error: underlying Objective-C module 'RNAudioRecorderPlayer' not found

[pulkitk702]

info Installing the app...

FAILURE: Build failed with an exception.

• Where: Settings file 'D:\Projects\CritiComm\criticomm\android\settings.gradle' line: 8

• What went wrong: A problem occurred evaluating settings 'CritiComm'.

Cannot convert string value '../node_modules/react-native-audio-recorder-player/android' to an enum value of type 'org.gradle.api.PathValidation' (valid case insensitive values: NONE, EXISTS, FILE, DIRECTORY)

• Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

• Get more help at https://help.gradle.org

BUILD FAILED in 5s

error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081

FAILURE: Build failed with an exception.

• Where: Settings file 'D:\Projects\CritiComm\criticomm\android\settings.gradle' line: 8

• What went wrong: A problem occurred evaluating settings 'CritiComm'.

Cannot convert string value '../node_modules/react-native-audio-recorder-player/android' to an enum value of type 'org.gradle.api.PathValidation' (valid case insensitive values: NONE, EXISTS, FILE, DIRECTORY)

• Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

• Get more help at https://help.gradle.org

BUILD FAILED in 5s

at makeError (D:\Projects\CritiComm\criticomm\node_modules\@react-native-community\cli-platform-android\node_modules\execa\index.js:174:9)
at D:\Projects\CritiComm\criticomm\node_modules\@react-native-community\cli-platform-android\node_modules\execa\index.js:278:16
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async runOnAllDevices (D:\Projects\CritiComm\criticomm\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:82:7)
at async Command.handleAction (D:\Projects\CritiComm\criticomm\node_modules\@react-native-community\cli\build\index.js:108:9)

info Run CLI with --verbose flag for more details. i am also facing the same issue can anyone find the solution ??

[puniker]

For Android, Step 1 can be removed and Step 3 should use implementation and not compile. Compile has been removed from gradle.

3. Insert the following lines inside the dependencies block in android/app/build.gradle:

  implementation project(':react-native-audio-recorder-player')

This has worked for me! Thanks!