Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ReactWebViewManager error after upgrading to 0.60.5

After upgrading from react-native 0.59.10 to 0.60.5 we are getting this error when building Android:

/workspace/mobile-custom-webview/mobile-custom-webview/android/src/main/java/invisionapp/customwebview/CustomWebViewManager.java:27: error: package com.facebook.react.
views.webview does not exist
import com.facebook.react.views.webview.ReactWebViewManager;
                                       ^
/workspace/mobile-custom-webview/mobile-custom-webview/android/src/main/java/invisionapp/customwebview/CustomWebViewManager.java:36: error: cannot find symbol
public class CustomWebViewManager extends ReactWebViewManager {

The custom webview is created according to the documentation: https://facebook.github.io/react-native/docs/custom-webview-android

Excerpt from CustomeWebViewManager.java:

...
import com.facebook.react.views.webview.ReactWebViewManager;
import javax.annotation.Nullable;

import java.util.Map;

@ReactModule(name = CustomWebViewManager.REACT_CLASS)
public class CustomWebViewManager extends ReactWebViewManager {
...

React Native version:

  info Fetching system and libraries information...
System:
    OS: macOS 10.14.6
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
    Memory: 37.35 MB / 16.00 GB
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 8.16.1 - ~/.nvm/versions/node/v8.16.1/bin/node
    Yarn: 1.16.0 - /usr/local/bin/yarn
    npm: 6.4.1 - ~/.nvm/versions/node/v8.16.1/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
    Android SDK:
      API Levels: 23, 24, 25, 26, 27, 28
      Build Tools: 23.0.1, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.3, 28.0.0, 28.0.0, 28.0.1, 28.0.2, 28.0.3
      System Images: android-25 | Google APIs Intel x86 Atom, android-25 | Google Play Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-27 | Google APIs Intel x86 Atom, android-28 | Google APIs Intel x86 Atom
  IDEs:
    Android Studio: 3.4 AI-183.6156.11.34.5692245
    Xcode: 10.1/10B61 - /usr/bin/xcodebuild
  npmPackages:
    react: 16.8.6 => 16.8.6 
    react-native: 0.60.5 => 0.60.5

In package.json we have:

 "dependencies": {
    "react": "16.8.6",
    "react-native": "0.60.5",
    "react-native-webview": "6.8.0"
  },

Steps To Reproduce

  1. Create an Android CustomWebView following the documentation: https://facebook.github.io/react-native/docs/custom-webview-android
  2. try to build Android by doing react-native run-android

Describe what you expected to happen: Android app should build and run just like before (0.59.10)

0.60 react-native doc page: doc page

like image 260
dudeinthemirror Avatar asked Jun 27 '26 15:06

dudeinthemirror


1 Answers

We were able to fix this issue. Here are a few pointers:

  • read the Autolinking doc carefully!
  • if it is a stand-alone module (like it is the case for us) then you need to inlude react-native-webview in: the build.gradle of the module
implementation project(":react-native-webview")

and in the settings.gradle of the consuming app

include ':react-native-webview'
project(':react-native-webview').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview/android')

even if in the consuming app, it is supposed to be autolinked.

also, you need to add a file called react-native.config.jsin the consuming app:

const path = require('path');

  module.exports = {
   dependencies: {
     'mobile-custom-webview': {
       root: path.resolve('../mobile-custom-webview'),
     },
   },
 };

in the Java file that defines the CustomWebView: replace:

import com.reactnativecommunity.webview.RNCWebViewPackage;

with

import com.reactnativecommunity.webview.RNCWebViewManager;

and then finally, a few methods have different signatures, for example: ReactWebView --> RNCWebView

like image 130
dudeinthemirror Avatar answered Jun 29 '26 07:06

dudeinthemirror



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!