npm set issue: SyntaxError

[las3r]

I've just got the epicreact course, cloned the first repo (this one) and ran npm run setup --silent

OS: Win10
npm: v7.9.0
node: v15.14.0

During set up a number of steps go well:
✅ Success: System Validation
✅ Success: Dependency Installation

Then in the project validation the tests all run succesfully, and right after I receive a syntax error:

D:/source/repos/epicreact/react-fundamentals/src/exercise/01.md (D:/source/repos/epicreact/react-fundamentals/node_modules/babel-loader/lib!D:/source/repos/epicreact/react-fundamentals/node_modules/mdx-loader!D:/source/repos/epicreact/react-fundamentals/src/exercise/01.md) SyntaxError: D:\source\repos\epicreact\react-fundamentals\src\exercise\01.md: Support for the experimental syntax 'jsx' isn't currently enabled (18:10):

> 18 |   return <MDXLayout {...layoutProps} {...props} components={components} mdxType="MDXLayout">

It gives the following hint:

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.

And the output ends with:
� Failure: Project Validation. Please review the messages above for information on how to troubleshoot and resolve this issue.

I checked issue #158 but that solution isn't work for me. I'm using a directory path without spaces too.

[las3r]

Fixed this by reading #149

I added a babel.config.js with the following contents:

module.exports = function (api) {
  api.cache(true);

  const presets = ["babel-preset-react-app"];
  const plugins = [];

  return {
    presets,
    plugins
  };
}

Setup now runs without any issues.

[kentcdodds]

Very strange. I'm glad it's working for you now. Thanks for posting your solution @las3r!