Line 0: Parsing error: Cannot read property 'map' of undefined
create-react-app, eslint, react-hooks, reactjs, typescript
Solution
Is this coming from eslint-typescript? If so, check that your version of typescript is not a dev/nightly build.
Problem
Currently starting up the server on my client side, the error above is what I have been getting. I am using TypeScript, ReactJS, ESLint. I can't seem to go forward since this error has been haunting me. The GitHub page for ESLint hasn't been of much help either. This error went up after I had created the useMutation component and exported it in `index.ts`. Not sure how to get rid of this error. ``` Below is my package.json ``` ``` { "name": "tinyhouse_client", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", "@types/jest": "^24.0.0", "@types/node": "^12.0.0", "@types/react": "^16.9.35", "@types/react-dom": "^16.9.0", "@typescript-eslint/parser": "^3.0.2", "react": "^16.13.1", "react-dom": "^16.13.1", "react-scripts": "3.4.1", "typescript": "~2.23.0" }, "resolutions": { "@typescript-eslint/eslint-plugin": "^2.23.0", "@typescript-eslint/parser": "^2.23.0", "@typescript-eslint/typescript-estree": "^2.23.0" }, "scripts": { "start": "react-scripts start", " build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, "eslintConfig": { "extends": "react-app" }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, **strong text** "proxy": "http://localhost:9000" } ``` ``` Below is my index.ts ``` ``` export * from './server'; export * from './useQuery'; export * from './useMutation'; ``` ``` And my useMutation.ts ``` ``` import { useState } from 'react'; import { server } from './server'; interface State<TData> { data: TData | null; loading: boolean; error: boolean; } type MutationTuple<TData, TVariables> = [ (variables?: TVariables | undefined) => Promise<void>, State<TData> ]; export const useMutation = <TData = any, TVariables = any>( query: string ): MutationTuple<TData, TVariables> => { const [state, setState] = useState<State<TData>>({ data: null, loading: false, error: false, }) const fetch = async (variables?: TVariables) => { try { setState({ data: null, loading: true, error: false }); const { data, errors } = await server.fetch<TData, TVariables>({ query, variables }); if (errors && errors.length) { throw new Error(errors[0].message); } setState({ data, loading: false, error: false }); } catch (err) { setState({ data: null, loading: false, error: true }); throw console.error(err); } } return [fetch, state]; }; ```