Support for the experimental syntax 'jsx' isn't currently enabled (45:5):

Steps to reproduce:

• Create a new react App
• Add https://github.com/Tordek/broken as a dependency (it’s simply a project that contains a file with .js extension but uses jsx syntax.
• Attempt to use the component in the app.

Result:

Failed to compile.

../broken/index.js
SyntaxError: D:\XXXX\broken\index.js: Support for the experimental syntax 'jsx' isn't currently enabled (4:13):

  2 |
  3 | export const Broken = () => {
> 4 |     return (<div></div>)
    |             ^
  5 | }

Add @babel/preset-react (https://git.io/JfeDR) to the 'presets' section of your Babel config to enable transformation.
If you want to leave it as-is, add @babel/plugin-syntax-jsx (https://git.io/vb4yA) to the 'plugins' section to enable parsing.

However the offered solution does not work because react-scripts/options/webpack.config.js disables the babelrc option.

On the other hand, this problem only seems to exist on Windows; it works fine in Linux.

[sarbull]

i’m not that happy to join this club 🥇

Support for the experimental syntax 'jsx' isn't currently enabled after creating a TypeScript react project and installing an NPM package with react components created with JavaScript.

[kovkev]

Actually… that helped me. Odd.