Support for the experimental syntax 'jsx' isn't currently enabled

In case you don't have a babel config file, create a .babelrc file in the root directory of your project (where your package.json file is).

And add the following code to it.

{
  "presets": ["@babel/preset-env", "@babel/preset-react"]
}

Make sure to place the .babelrc file in the root directory of your project (where your package.json file is).

The following command installs the @babel/preset-react package.

npm install --save-dev @babel/preset-react

The following command installs the @babel/preset-env package.

npm install --save-dev @babel/preset-env

Try to restart your IDE and development server after making the changes.

If the error persists, create a babel.config.js file in the root directory of your project (where your package.json file is) and set the presets there as well.

module.exports = {
  presets: [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
};

If you use a webpack.config.js file, set @babel/preset-react in the rules array under modules.

// ... rest
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/i,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: [
              '@babel/preset-env',
              '@babel/preset-react',
            ],
          },
        },
      },
      // ... Your other rules
    ],
  },
// ... rest

Another common cause of the error is when you try to start your development server with your terminal located in a directory whose path contains symbolic links.

To resolve the issue in this case, change your terminal to the complete (non-symlink) path before issuing the: npm start command.