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

[ShaharyarMaroof]

Bug

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

This error is located at:
    in ARTShape (at Shape.js:61)
    in Shape (at Donut.js:59)
    in ARTGroup (at Group.js:35)
    in Group (at Donut.js:57)
    in ARTSurfaceView (at Surface.js:37)
    in Surface (at Donut.js:56)
    in RCTView (at Donut.js:54)
    in DonutChart (at App.js:32)
    in RCTView (at App.js:31)
    in RCTScrollContentView (at ScrollView.js:1038)
    in RCTScrollView (at ScrollView.js:1178)
    in ScrollView (at App.js:28)
    in RCTSafeAreaView (at SafeAreaView.js:55)
    in SafeAreaView (at App.js:27)
    in App (at renderApplication.js:40)
    in RCTView (at AppContainer.js:101)
    in RCTView (at AppContainer.js:119)
    in AppContainer (at renderApplication.js:39)

getNativeComponentAttributes
    getNativeComponentAttributes.js:29:2
createReactNativeComponentClass$argument_1
    requireNativeComponent.js:26:4
exports.get
    ReactNativeViewConfigRegistry.js:102:17

Environment info

React native info output:

 System:
    OS: macOS 10.15.2
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
    Memory: 540.21 MB / 16.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.16.3 - /usr/local/bin/node
    npm: 6.9.0 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1
    Android SDK:
      API Levels: 22, 23, 25, 26, 27, 28, 29
      Build Tools: 23.0.1, 25.0.0, 27.0.3, 28.0.2, 28.0.3, 29.0.0, 29.0.2
      System Images: android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5791312
    Xcode: 11.3/11C29 - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: 0.61.5 => 0.61.5 
  npmGlobalPackages:
    react-native-log-ios: 1.0.1
    react-native: 0.60.5

Library version: @react-native-community/art": "^1.1.2"

Steps To Reproduce

1. Use the demo code below
2. the simulators throws the above mentioned exception ...

Describe what you expected to happen:

1. A chart should render

Reproducible sample code

import React from 'react';
import { View, Text } from 'react-native';
import * as d3 from 'd3';

import { Surface, Shape, Group } from '@react-native-community/art';

const userPurchases = [
  {
    itemName: 'Mountain Dew',
    price: 3
  },
  {
    itemName: 'Shoes',
    price: 50
  },
  {
    itemName: 'Kit Kat',
    price: 1
  },
  {
    itemName: 'Taxi',
    price: 24
  },
  {
    itemName: 'Watch',
    price: 100
  },
  {
    itemName: 'Headphones',
    price: 15
  },
  {
    itemName: 'Wine',
    price: 16
  }
];

const sectionAngles = d3.pie().value(d => d.price)(userPurchases);
const path = d3
  .arc()
  .outerRadius(100) //must be less than 1/2 the chart's height/width
  .padAngle(0.05) //defines the amount of whitespace between sections
  .innerRadius(0.6); //the size of the inner 'donut' whitespace

const DonutChart = () => {
  const height = 250,
    width = 250;
  const colors = d3
    .scaleLinear()
    .domain([0, userPurchases.length])
    .range([0, 255]);

  return (
    <View style={{ flex: 1, backgroundColor: 'grey' }}>
      <Text>Chart</Text>
      <Surface width={width} height={height}>
        <Group x={width / 2} y={height / 2}>
          {sectionAngles.map((section, index) => (
            <Shape
              key={section.index}
              d={path(section)}
              stroke="#000"
              fill={'#0000FF'}
              strokeWidth={1}
            />
          ))}
        </Group>
      </Surface>
    </View>
  );
};

export default DonutChart;

[phatjme]

Looks like a problem with your dependencies. Try the following if you haven't already:

1. cd ios && pod install
2. cd .. && react-native link
3. npm start --reset-cache
4. npx react-native run-ios

If still not working check the dependency is installed properly and your RN version is above 6.0 for auto-linking...

[michaelmaitland]

also getting this bug

Steps i have taken:

1. npm install
2. pod install
3. react-native run-ios

I have tried deleting node_modules This is not an expo project

I also ran react-native link despite being on > .60

[abhi-nahi]

Any progress guys....!! I'm also having the same issue.

[tcodes0]

I think on 0.62 this lib is not autolinking as expected. This should be fixable by adding this line to your podfile

  pod 'ReactNativeART', :path => '../node_modules/@react-native-community/art'

[aithashi]

+1 android

[eunbok-bocoder]

android ---> https://bocoder.tistory.com/40