Render Errors thrown when using Recharts with Expo React Native

Question

I want to use Recharts Chart Library (https://recharts.org/en-US) for my Expo React Native Application.

When Implementing Recharts LineChart like this:

import {Line, LineChart, XAxis, YAxis} from "recharts";

export default function Profile() {

    const data = [
        { name: 'Jan', uv: 400, pv: 2400, amt: 2400 },
        { name: 'Feb', uv: 300, pv: 1398, amt: 2210 },
        { name: 'Mar', uv: 200, pv: 9800, amt: 2290 },

    ];

    return (
        <LineChart width={400} height={300} data={data} title={"Test"}>
            <XAxis dataKey="name" />
            <YAxis />
            <Line type="monotone" dataKey="uv" stroke="#8884d8" />
            <Line type="monotone" dataKey="pv" stroke="#82ca9d" />
        </LineChart>
    );
}

I get Errors like:

ERROR Error: Text strings must be rendered within a component. This error is located at: in title (created by Surface) in svg (created by Surface) in Surface (created by LineChart) in div (created by LineChart) in LineChart (created by Profile) in Profile

or like this:

ERROR Invariant Violation: View config getter callback for component circle must be a function (received undefined). Make sure to start component names with a capital letter.

This error is located at: in circle (created by Dot) in Dot (created by Line) in g in Unknown (created by Line) in g in Unknown (created by Line) in Line (created by Profile) in svg (created by Surface) in Surface (created by LineChart) in div (created by LineChart) in LineChart (created by Profile) in Profile

My package.json looks like this:

{
  "main": "expo-router/entry",
  "scripts": {
    "start": "expo start",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "eject": "expo eject"
  },
  "dependencies": {
    "@expo/vector-icons": "^13.0.0",
    "@miblanchard/react-native-slider": "^2.3.1",
    "@react-native-async-storage/async-storage": "1.18.2",
    "@react-navigation/bottom-tabs": "^6.0.9",
    "@react-navigation/native": "^6.0.6",
    "@react-navigation/native-stack": "^6.2.5",
    "@shopify/flash-list": "1.4.3",
    "@supabase/supabase-js": "^2.32.0",
    "expo": "^49.0.7",
    "expo-asset": "~8.10.1",
    "expo-constants": "~14.4.2",
    "expo-font": "~11.4.0",
    "expo-haptics": "~12.4.0",
    "expo-linear-gradient": "~12.3.0",
    "expo-linking": "~5.0.2",
    "expo-router": "2.0.0",
    "expo-secure-store": "~12.3.1",
    "expo-splash-screen": "~0.20.5",
    "expo-status-bar": "~1.6.0",
    "nativewind": "^2.0.11",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.72.6",
    "react-native-countdown-circle-timer": "^3.2.1",
    "react-native-elements": "^3.4.3",
    "react-native-gesture-handler": "~2.12.0",
    "react-native-safe-area-context": "4.6.3",
    "react-native-screens": "~3.22.0",
    "react-native-slider": "^0.11.0",
    "react-native-url-polyfill": "^2.0.0",
    "react-native-web": "~0.19.6",
    "recharts": "^2.9.0",
    "sentry-expo": "~7.0.0",
    "tailwindcss": "^3.3.2"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/react": "~18.2.14",
    "typescript": "^5.1.3"
  },
  "private": true,
  "name": "focuscoin",
  "version": "0.0.1"
}

I tried multiple chart frameworks like React Vis, Victory and many others and none of them seem to work. So I am guessing it maybe has something to do with svg since this is contained in all the errors. But I have no Idea.

Thank you very much for helping.