react-native-gifted-charts
react-native-gifted-charts copied to clipboard
Uncaught Error: Module parse failed: Unexpected token
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!