title: How is ESLint integrated into Create React App?
body: <p>When I run <code>npx create-react-app ...</code>, a bare-bone React project is being created for me.
  When I then peek into <code>package.json</code>, there seems to be some evidence of ESLint to be present, as there is this:</p>
  
  <pre><code>"eslintConfig": {
    "extends": "react-app"
  },
  </code></pre>
  
  <p>However, whenever I install ESLint as a dev dependency and configure it -- as I usually do --, VS Code seems to pick it up.
  In this case, VS Code does not seem to recognize that there is any kind of linter present/configured.
  This is not super surprising, as ESLint is not a dependency of the React project I just generated -- at least not according to <code>package.json</code>.
  When I try to run <code>eslint .</code> within the project's root directory, it says "command not found".</p>
  
  <p>I tried to breathe life into this ESLint configuration by expanding it, so now I have this:</p>
  
  <pre><code>"eslintConfig": {
    "extends": ["react-app", "eslint:recommended", "google"],
    "rules": {
      "semi": ["error", "always"],
      "quotes": ["error", "double"]
     }
  },
  </code></pre>
  
  <p>This changes nothing.
  I manipulated the source code in a way that I know it violates the above configuration, yet, I have not been signaled any wrongdoing.</p>
  
  <p>This leads me to a simple question:
  <strong>Do projects generated by <code>create-react-app</code> come with some kind of ESLint configuration, and, if so, how do I enable and extend it correctly?</strong></p>
  
  <p>As I am being referred to <a href="https://create-react-app.dev/docs/setting-up-your-editor/" rel="noreferrer">the number one Google hit that comes up when searching "create react app eslint"</a> -- which I have obviously read --, let me clarify what I mean:</p>
  
  <p>ESLint is obviously integrated into Create React App in a different way than it would be if it had been manually added to the project using <a href="https://eslint.org/docs/user-guide/getting-started" rel="noreferrer">like so</a>.
  This is not only evident by the sheer number of people who post about their struggles of getting the two to work together.
  This is also evident as...</p>
  
  <ul>
  <li>...one cannot run the <code>eslint</code> command in the project root.</li>
  <li>...ESLint does not seem to be a dependency within <code>package.json</code>.</li>
  <li>...VS Code doesn't pick up that there is ESLint present.</li>
  <li>...there is no <code>.eslintrc.*</code> file in the project root.</li>
  <li>...etc.</li>
  </ul>
  
  <p>So: How do I go about ESLint in the context of Create React App? For starters: How do I run it? How do I expand it? And why does VS Code not pick it up -- even though it usually notices the presence of ESLint?</p>