react-native-gifted-charts icon indicating copy to clipboard operation
react-native-gifted-charts copied to clipboard

Uncaught Error: Module parse failed: Unexpected token

Open cs-manughian opened this issue 1 month ago • 3 comments

I installed the package using the recommended approach:

npx expo install react-native-gifted-charts expo-linear-gradient react-native-svg

With the following react typescript versions and ts config:

npm list:

├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

ts.config:

{
  "extends": "expo/tsconfig.base",
  "compilerOptions": {
    "jsx": "react-jsx",
    "strict": true
  },
  "include": [
    "**/*.ts",
    "**/*.tsx"
  ]
}

Then, when I run my app in the web emulator, I get this error and nothing is rendered:

bootstrap:27 Uncaught Error: Module parse failed: Unexpected token (3:7)
File was processed with these loaders:
 * ./node_modules/source-map-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
| import { useEffect, useMemo, useState } from 'react'
| import {
>   type lineConfigType,
|   type BarChartPropsType,
|   type barDataItem,
    at ./node_modules/gifted-charts-core/src/BarChart/index.ts (fontfaceobserver.standalone.js:8:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at ./node_modules/gifted-charts-core/src/index.js (fontfaceobserver.standalone.js:8:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at ./node_modules/react-native-gifted-charts/src/Components/AnimatedThreeDBar/index.tsx (styles.tsx:47:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at ./node_modules/react-native-gifted-charts/src/BarChart/RenderBars.tsx (Animated2DWithGradient.tsx:197:1)

I tried updating my app.json to include the packages like so, but it had no effect:

    "web": {
      "favicon": "./assets/icons/icon-1024.png",
      "build": {
        "babel": {
          "include": [
            "react-native-gifted-charts",
            "expo-linear-gradient",
            "react-native-svg"
          ]
        }
      }
    },

I really want to use this package but it doesn't seem to function with my project. Does anyone have any advice? Thank you!

cs-manughian avatar May 30 '24 04:05 cs-manughian