RNCardView 的本机组件不存在

Native component for RNCardView does not exist

我知道已经有很多类似的帖子出现了这个错误,但是 none 解决了我的问题..

我一直在尝试在我的项目上设置 react-native-cardview,但我不断收到以下错误:

Invariant Violation: Native component for "RNCardView" does not exist

This error is located at:
    in RCTText (at Text.js:548)
    in Text (at Button.js:137)
    in RCTView (at View.js:71)
    in View (at Button.js:136)
    in TouchableNativeFeedback (at Button.js:128)
    in Button (at FormLogin.js:45)
    in RNCardView (at FormLogin.js:21)
    in RCTView (at View.js:71)
    in View (at FormLogin.js:20)
    in FormLogin (at SceneView.js:17)
    in SceneView (at CardStack.js:374)
    in RCTView (at View.js:71)
    in View (at CardStack.js:373)
    in RCTView (at View.js:71)
    in View (at CardStack.js:372)
    in RCTView (at View.js:71)
    in View (at createAnimatedComponent.js:147)
    in AnimatedComponent (at Card.js:12)
    in Card (at PointerEventsContainer.js:39)
    in Container (at CardStack.js:414)
    in RCTView (at View.js:71)
    in View (at CardStack.js:348)
    in RCTView (at View.js:71)
    in View (at CardStack.js:347)
    in CardStack (at CardStackTransitioner.js:66)
    in RCTView (at View.js:71)
    in View (at Transitioner.js:142)
    in Transitioner (at CardStackTransitioner.js:19)
    in CardStackTransitioner (at StackNavigator.js:38)
    in Unknown (at createNavigator.js:13)
    in Navigator (at createNavigationContainer.js:214)
    in NavigationContainer (at registerRootComponent.js:35)
    in RootErrorBoundary (at registerRootComponent.js:34)
    in ExpoRootComponent (at renderApplication.js:35)
    in RCTView (at View.js:71)
    in View (at AppContainer.js:102)
    in RCTView (at View.js:71)
    in View (at AppContainer.js:122)
    in AppContainer (at renderApplication.js:34)

这是我的app.json

{
  "expo": {
    "sdkVersion": "25.0.0",
    "android": {
      "package": "hiking"
    },
    "name": "Hiking",
    "slug": "hiking",
    "version": "0.1.0",
    "isDetached": true,
    "detach": {
      "scheme": "exp56fa0b6664574a6ea12b193494508d48",
      "androidExpoViewUrl": "https://s3.amazonaws.com/exp-exponent-view-code/android-v2.3.0-sdk25.0.0-0c32461b-a7c6-4ddc-b85b-32a80c4f18d9.tar.gz"
    }
  }
}

和package.json

{
  "name": "Hiking",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "jest-expo": "25.0.0",
    "react-test-renderer": "16.2.0"
  },
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "test": "node node_modules/jest/bin/jest.js"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "expo": "^25.0.0",
    "react": "16.2.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-25.0.0.tar.gz",
    "react-native-cardview": "^1.1.5",
    "react-native-maps": "^0.20.1",
    "react-navigation": "^1.0.3",
    "rn-textinputlayout": "^1.0.5"
  }
}

react-native link react-native-cardview 没有解决问题。 手动安装(在 readme 中)没有解决问题。 重建并重新启动服务器没有解决问题。

我已经能够成功安装其他库(例如 maps 或 textinputlayout)。

我成功使用了这个模块。它有一些自动链接问题(当 运行 react-native link 时。这是我为 Android:

修复它所必须做的事情
  1. android/app/src/main/java/com/YOUR_APP_ID_HERE/MainApplication.java,删除import com.reactlibrary.RNCardViewPackage;并替换为import com.kishanjvaghela.cardview.RNCardViewPackage;

  2. 第一个修复应该是你所需要的,但在同一个文件中确保你在 protected List<ReactPackage> getPackages() { 中有一个条目 new RNCardViewPackage()

  3. android/settings.gradle 中确保你有这些行:

    包括':react-native-cardview' project(':react-native-cardview').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-cardview/android')

最后我不认为这是这个模块的问题,但检查以确保。如果您使用的是 RN 0.47 plus,请转到 node_modules 目录并删除 createJSModules(如果存在)- https://github.com/jsierles/react-native-audio/pull/216/files

对于那些 运行 遇到同样问题的人,我设法通过完全改变项目的处理方式来解决它。

我拥有的是一个用 create-react-native-app 制作的项目,我用 Expo XDE 将它弹出到 运行。

我用 react-native init、copy-pasted 我的 .js 文件和 npm install 创建了另一个项目,一切都 运行 完美无缺。

似乎 Expo XDE 没有正确处理 react-native link 指令,有点迷茫。

无论如何,选择 react-native init 而不是弹出项目。

只是对@Noitidart 答案的补充,"MainApplication.java" 中的 getPackages() 将如下所示

protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
        new MainReactPackage(),
        new RNCardViewPackage()
    );
}

这听起来像是 webview 版本问题。您必须卸载当前的 webview 版本并安装 5.8.1 版本。

执行以下步骤:

  1. react-native卸载react-native-webview

  2. react-native安装react-native-webview@5.8.1

有关 https://github.com/react-native-community/react-native-webview/issues/580

的更多信息