Create-react-app command doesn't use ES6 classes

Question

I'm trying to learn React and am following a few tutorials. When I run the create-react-app command from my terminal however, my App.js file is not the ES6 version that I see with tutorials. Instead it contains the following:

import React from 'react';
import logo from './logo.svg';
import './App.css';

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;

instead of the ES6 style syntax...

class App extends React.Component {
  //...
}

Why is this and how can I change it so that when I run the command to create an app it automatically creates a more up-to-date version?

Thank you

Answer 1

Functional components are peers with class-based components. Neither is more up-to-date than the other (hooks aside). Functional components are getting used much more often than they used to be, though, thanks to hooks . (In fact, since hooks can't be used with class-based components, there might be an argument that functional components have access to newer features than class-based ones do...)

Looking at create-react-app 's command-line switches, it doesn't look like it has an option to create a class-based App component for you. But of course, it's a small change to make immediately after creating the app, if you prefer it be a class-based component. You just edit the App.js (or App.tsx ) file.

Answer 2

Create React App 2.0

I have used the following command which works for me. I have passed the react-scrips version also.

npx

npx create-react-app my-app --scripts-version=react-scripts@2.0

npm

npm init react-app my-app --scripts-version=react-scripts@2.0

Create React App 2.0: Babel 7, Sass, and More