Input in react-validation lies under build folder. But from the error it seems that you didn't imported Input properly: SyntaxError: E:\Projects\personal\rental-application\node_modules\react-validation\src\components\input\index.js: Support for the experimental syntax 'jsx' isn't currently enabled (6:3):

Can you please check your import statement? It should be something like this:

import Input from "react-validation/build/input";

Running the below command solved my issue

npm install --save-dev @babel/plugin-proposal-private-property-in-object

use --save-dev to install it under devDependencies

2024 update:

The package @babel/plugin-proposal-private-property-in-object is deprecated.

1. Use npm install --save-dev @babel/plugin-transform-private-property-in-object instead.

2. Reference the package in your .eslintrc, e.g.

{
  "extends": ["@babel/plugin-transform-private-property-in-object", "next/core-web-vitals"]
}

Try using this config in .babelrc file. The modules: false reason can be found here

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

https://babeljs.io/docs/en/v7-migration#package-renames

{
-  "presets": ["@babel/preset-react"],
+  "presets": ["@babel/react"], // this is equivalent
-  "plugins": ["@babel/transform-runtime"],
+  "plugins": ["@babel/plugin-transform-runtime"], // same
}

If this appears in VSCode with the fullstack approach (front and back as subfolders within your workspace), adjust eslint extensions configurations for your current workspace in .vscode/settings.json as following:

  "eslint.workingDirectories": [
    "./back",
    "./front"
  ]

That solved this issue in my case.