Cannot create React App

Question

I have the following project:

I have a source folder src with the following structure

src/
├── sass/
│   └── sass files
│
├── js/
│   ├── admin
│   │    └── React project (an Admin Dashboard)
│   │
│   └── main
│        └── Javascript for the main site
│
└── pug/
    └── pug files

I used create-react-app to create the react project, and then I had to eject it so I could move it into my structure where I wanted.

I wrote over the paths in the ejected config/paths.js like this:

module.exports = {
  dotenv: resolveApp('.env'),
  appBuild: resolveApp('docs'),
  appPublic: resolveApp('src/public'),
  appHtml: resolveApp('src/public/index.html'),
  appIndexJs: resolveApp('src/js/admin/index.js'),
  appPackageJson: resolveApp('package.json'),
  appSrc: resolveApp('src'),
  yarnLockFile: resolveApp('yarn.lock'),
  testsSetup: resolveApp('src/setupTests.js'),
  appNodeModules: resolveApp('./node_modules'),
  publicUrl: getPublicUrl(resolveApp('package.json')),
  servedPath: getServedPath(resolveApp('package.json')),
};

But when I run the command "node scripts/start.js" to start the react development server I get the following problem:

Starting development server....
Failed to compile.
Syntax error: Unexpected token (19:16)

  17 | 
  18 | 
> 19 | ReactDOM.render(<App />, document.getElementById('root'));
     |                 ^
  20 | registerServiceWorker();

Could someone help me resolve the paths? (Am I guessing right that the problem is with the paths, or it can be something else?)

Answer 1

You have to add react to .babelrc:

-{ "presets": ["es2015"] }
+{ "presets": ["es2015", "react"] }