Adding imports from "@rainbow-me/animated-charts" crashes Expo app: "TypeError: this.InnerNativeModule.configureProps is not a function."

Viewed 381

I am using a Windows computer and working on a React Native project using Yarn and Expo. I am trying to use "@rainbow-me/animated-charts".

Here are the summarized steps I took to install their package, as per their documentation.

  1. Installed react-native-reanimated (~2.3.1).

  2. Adjusted my babel.config.js file.

  3. Installed @rainbow-me/animated-charts (^1.0.0-alpha.6)

  4. Cleared Expo bundler cache using "expo start --clear"

I created a separate Screen to replicate this issue using the example code provided in their Github repo:https://github.com/rainbow-me/react-native-animated-charts

import React from "react";
import { View, Text, Dimensions } from "react-native";
import {
  ChartDot,
  ChartPath,
  ChartPathProvider,
  monotoneCubicInterpolation,
} from "@rainbow-me/animated-charts";

export const { width: SIZE } = Dimensions.get("window");

const data = [
  { x: 1453075200, y: 1.47 },
  { x: 1453161600, y: 1.37 },
  { x: 1453248000, y: 1.53 },
  { x: 1453334400, y: 1.54 },
  { x: 1453420800, y: 1.52 },
  { x: 1453507200, y: 2.03 },
  { x: 1453593600, y: 2.1 },
  { x: 1453680000, y: 2.5 },
  { x: 1453766400, y: 2.3 },
  { x: 1453852800, y: 2.42 },
  { x: 1453939200, y: 2.55 },
  { x: 1454025600, y: 2.41 },
  { x: 1454112000, y: 2.43 },
  { x: 1454198400, y: 2.2 },
];

// const points = monotoneCubicInterpolation({ data, range: 40 });

const TestingScreen = () => {
  return (
    <View style={{ backgroundColor: "black" }}>
      <ChartPathProvider data={{ points, smoothingStrategy: "bezier" }}>
        <ChartPath height={SIZE / 2} stroke="yellow" width={SIZE} />
        <ChartDot style={{ backgroundColor: "blue" }} />
      </ChartPathProvider>
    </View>
  );
};

export default TestingScreen;

Here is the issue

As soon as I add the imports line:

import {
  ChartDot,
  ChartPath,
  ChartPathProvider,
  monotoneCubicInterpolation,
} from "@rainbow-me/animated-charts";

Expo crashes, see below:

Expo error

Is there a solution to this?

0 Answers
Related