Using ESLint with create-react-app

Everything you've seen so far in this chapter, you've had to set up and configure yourself. Not that getting ESLint up and running is particularly difficult or anything, but create-react-app abstracts this away completely. Remember, the idea with create-react-app is start writing component code as soon as possible, without having to think about configuring things like linters.

To see this in action, let's create a new app using create-react-app:

create-react-app my-new-app

Then, start the app as soon as it's created:

npm start

Now let's get ESLint to complain about something. Open up App.js in your editor—it should look something like this:

import React, { Component } from 'react'; 
import logo from './logo.svg'; 
import './App.css'; 
 
class App extends Component { 
  render() { 
    return ( 
      <div className="App"> 
        <header className="App-header"> 
          <img src={logo} className="App-logo" alt="logo" /> 
          <h1...