I have Node.js v14.16.1 installed. I created an app using the command npx create-react-app.

I start the app in the terminal by npm start. It opens localhost:3000 in the browser (Chrome 93.0.4577.63).

The index.js file is

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

reportWebVitals();

At first the browser console is not showing an error. When I delete the semicolon in the first line and write it again it shows an error Uncaught SyntaxError: Cannot use import statement outside a module.`

If I change the first line to const React = require('react'); then the console doesn't show an error in that line but the next line shows the same error.

I thought the error would go away if I closed the app, added "type": "module" to package.json and launched the app again. However the error did not go away. What should I do?

create-react-app should manage babel on its own.