i'm occuring that problem:

Line 9:38: Parsing error: Unexpected token, expected "," prettier/prettier

in index.tsx file.

import React, { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

const rootElement = document.getElementById('root');
const root = createRoot(rootElement as Element);

root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

reportWebVitals();

I can't find fix on the internet, anyone know how to fix that?

i'm occuring that problem:

Line 9:38: Parsing error: Unexpected token, expected "," prettier/prettier

in index.tsx file.

import React, { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

const rootElement = document.getElementById('root');
const root = createRoot(rootElement as Element);

root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

reportWebVitals();

I can't find fix on the internet, anyone know how to fix that?

• javascript
• reactjs
• typescript

• Have you configured eslint & prettier in your project? – Pratik Wadekar Commented Jul 14, 2022 at 17:38
• @PatikWadekar yes, here's my configuration on Github: github./xflameyoke/interactive-ment-section-app/blob/main/… – xFlame Commented Jul 14, 2022 at 17:40
• I think you need to check this configuration prettier/prettier in your eslintrc – Pratik Wadekar Commented Jul 14, 2022 at 17:48
• Is this really necessary const root = createRoot(rootElement as Element); ? Wouldn't sth like const root = createRoot(rootElement); suffice? – user18821127 Commented Jul 14, 2022 at 18:29
• @user18821127 error after deleting 'as Element': Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element | DocumentFragment'. Type 'null' is not assignable to type 'Element | DocumentFragment'. – xFlame Commented Jul 14, 2022 at 18:49

1 Answer 1

I found the issue by cloning into your repo. It is with "parser": "babel" in eslint.rc prettier/prettier.

Use "parser": "babel-ts" or "parser": "typescript".