与 react-native run-ios 独占的不变违规答案

【问题标题】：Invariant Violation with react-native run-ios exclusive与 react-native run-ios 独占的不变违规
【发布时间】：2019-03-22 15:55:14
【问题描述】：

我尝试在我的应用程序中实现react-native-canvas。在使用 react-native run-ios 生成的版本中进入包含画布的屏幕时，我收到以下错误：

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

This error is located at:
 in RNCWKWebView (at WebView.ios.js:297)
 in RCTView (at View.js:45)
 in View (at WebView.ios.js:300)
 in WebView (at Canvas.js:148)
 in RCTView (at View.js:45)
 in View (at Canvas.js:147)
 in Canvas (at LapDetails.tsx:47)
 in RCTView (at View.js:45)
 in View (at LapDetails.tsx:38)
 in LapDetails (at ComponentWrapper.js:29)
 in WrappedComponent (at renderApplication.js:34)
 in RCTView (at View.js:45)
 in View (at AppContainer.js:98)
 in RCTView (at View.js:45)
 in View (at AppContainer.js:115)
 in AppContainer (at renderApplication.js:33)

getNativeComponentAttributes
 a90c6db6-7158-4812-8a98-ea48c1a859f3:49643:5
<unknown>
 a90c6db6-7158-4812-8a98-ea48c1a859f3:49596:14
Object.exports.get
 a90c6db6-7158-4812-8a98-ea48c1a859f3:43914:20
createInstance
 a90c6db6-7158-4812-8a98-ea48c1a859f3:22099:56
completeWork
 a90c6db6-7158-4812-8a98-ea48c1a859f3:28453:34
completeUnitOfWork
 a90c6db6-7158-4812-8a98-ea48c1a859f3:30472:32
performUnitOfWork
 a90c6db6-7158-4812-8a98-ea48c1a859f3:30635:18
workLoop
 a90c6db6-7158-4812-8a98-ea48c1a859f3:30645:30
renderRoot
 a90c6db6-7158-4812-8a98-ea48c1a859f3:30716:13

第二次进入视图时出错：

Invariant Violation: View config not found for name RNCWKWebView.

This error is located at:
 in RNCWKWebView (at WebView.ios.js:297)
 in RCTView (at View.js:45)
 in View (at WebView.ios.js:300)
 in WebView (at Canvas.js:148)
 in RCTView (at View.js:45)
 in View (at Canvas.js:147)
 in Canvas (at LapDetails.tsx:47)
 in RCTView (at View.js:45)
 in View (at LapDetails.tsx:38)
 in LapDetails (at ComponentWrapper.js:29)
 in WrappedComponent (at renderApplication.js:34)
 in RCTView (at View.js:45)
 in View (at AppContainer.js:98)
 in RCTView (at View.js:45)
 in View (at AppContainer.js:115)
 in AppContainer (at renderApplication.js:33)

 Object.exports.get
  ReactNativeViewConfigRegistry.js:94:6
 createInstance
  ReactNativeRenderer-dev.js:3946:49
 completeWork
  ReactNativeRenderer-dev.js:13385:25
 completeUnitOfWork
  ReactNativeRenderer-dev.js:15892:25
 performUnitOfWork
  ReactNativeRenderer-dev.js:16103:11
 workLoop
  ReactNativeRenderer-dev.js:16115:23
 renderRoot
  ReactNativeRenderer-dev.js:16219:6
 performWorkOnRoot
  ReactNativeRenderer-dev.js:17198:6
 performWork
  ReactNativeRenderer-dev.js:17099:6

现在是有趣的部分。当我运行从 XCode 完全构建的应用程序时，我可以进入视图并显示画布。我尝试了自动重新链接、重新安装、不同的设备和手动重新链接，因为那些最常提到的修复该类型问题的方法。但是没有任何改变使用react-native run-ios 生成的版本的结果。

我很确定问题出在我的 react-native-webview 链接的某个地方，但我不知道在哪里，我基本上做了安装指南提到的所有事情......

我的 android 项目目前已损坏，因此我无法提供有关 android 行为的其他信息。

如果您想知道这是视图：

import React, { Component } from 'react';
import Canvas from 'react-native-canvas';

class App extends Component {

 handleCanvas = (canvas) => {
  const ctx = canvas.getContext('2d');
  ctx.fillStyle = 'purple';
  ctx.fillRect(0, 0, 100, 100);
 }

 render() {
  return (
   <Canvas ref={this.handleCanvas}/>
  );
 }
}

【问题讨论】：

如果可以从 xcode 构建它，为什么不这样做呢？
因为我在那个版本上没有调试控制台，没有热重载，没有自动重载。又名没有开发环境
我通常做的是启动打包器，然后从 xcode 构建
您找到解决方案了吗？无论我是在终端中使用 XCode 还是使用 react-native run-ios 构建，都会发生这种情况。发生在模拟器和 iPhone 上。
@cheeesus 我发布了对我有帮助的答案，希望对您有所帮助！

标签： react-native react-native-ios react-native-webview

【解决方案1】：

通常这样的问题是由不正确的链接原生依赖引起的。您可以尝试react-native link <package name>，但这里似乎并非如此，因为完全构建的应用程序工作正常。

一些旧的构建文件会干扰开发构建，我通过删除整个项目并再次用 git 克隆它来解决这个问题。要在没有 git 的情况下执行此操作，您需要删除 android/ 和 ios/ 中的所有构建文件并删除您的 node_modules（这不是必须这样做，但为了安全起见）。

如果您在此之后仍然遇到问题，您可能会认为第一个问题代表您的情况，特别是如果您甚至无法编译生产版本。

【讨论】：