不变违规：requireNativeComponent：在UIManager中找不到“ RNCWebView”

Question

朋友们，我在将react-native-webview链接到我的项目后遇到了这个错误

Invariant Violation: requireNativeComponent: "RNCWebView" was not found in the UIManager.

    This error is located at:
        in RNCWebView (at WebView.android.js:250)
        in RCTView (at WebView.android.js:253)
        in WebView (at App.js:7)
        in App (at renderApplication.js:45)
        in RCTView (at AppContainer.js:109)
        in RCTView (at AppContainer.js:135)
        in AppContainer (at renderApplication.js:39)

还有我的代码

import React, { Component } from 'react';
import { WebView } from 'react-native-webview';

export default class App extends Component {
  render() {
    return (
      <WebView
        originWhitelist={['*']}
        source={{ html: '<h1>Hello world</h1>' }}
      />
    );
  }
}

Error Image in my android

Answer 1

使用 React Native 0.60+，无需向 podfile 添加任何内容。 再试一次cd ios && pod install

如果没有帮助，请尝试重新启动模拟器并重建应用程序。 重启 Xcode 也是一个好主意。

您可以选择清理 XCode 中的构建文件夹

Answer 2

运行react-native link react-native-webview

检查：https://github.com/react-native-community/react-native-webview/issues/140

Answer 3

我有同样的问题。尝试将此行添加到您的Podfile中：-

pod 'react-native-webview', :path => PROJECT_PATH + 'react-native-webview'

然后转到ios文件夹 cd ios 并安装Pod pod安装

它为我解决了这个问题。

Answer 4

我之前也遇到过同样的问题，我试过这个：

pod 'react-native-webview', :path => PROJECT_PATH + 'react-native-webview'

Answer 5

100％的工作技术保证人

1. 删除pods文件夹和podfile.lock
2. 删除npm react-native-webview
3. 安装npm我react-native-webview
4. cd ios
5. pod安装
6. react-native run-ios
7. 重置缓存

//多数民众赞成

Answer 6

我已完成以下步骤：

 1. cd ios
 2. rm Podfile.lock
 3. pod install

这将安装缺少的库，即 react-native-webview ，并将以下行添加到Podfile文件中。

 pod 'react-native-webview', :path => '../node_modules/react-native-webview'

我正在研究的环境：

"react": "16.9.0",
"react-native": "0.61.5"

Answer 7

我对这个问题的解决方法如下：

Android

1将其添加到您的android / settings.gradle

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

2将此添加到您的android / app / build.gradle

dependencies {
    implementation project(':react-native-webview')
    ....

MainApplication.java中的3：

import com.reactnativecommunity.webview.RNCWebViewPackage;//add this import
....

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new RNCWebViewPackage(),//add line
          ....

IOS

1在ios / Podfile中添加以下行，然后打开终端，转到项目ios文件夹并运行pod install

...
  pod 'react-native-webview', :path => '../node_modules/react-native-webview'
...

Answer 8

安装和链接webview包后尝试重新构建你的项目（npx react-native run-android）

Answer 9

确保你做到了：

1. npx pod-install
2. npx react-native run-ios

安装包后你。需要更新pods，然后再次运行项目。