title: Arrow Function not working in VS code in react even after installing ESlint
body: <p>This is my code and my VSCode is showing the error in arrow function &quot;Unexpected token. Did you mean <code>{'&gt;'}</code> or <code>&amp;gt;</code>?ts(1382)&quot;. I have a jsconfig.json file. I have the Babel ESlint extension on. I have tried most of the things on the internet. So what am I doing wrong?</p>
  <pre><code>import React from 'react';
  import SiteHeader from '../components/SiteHeader';
  import { useQuery, gql } from '@apollo/client';
  
  const NEWS = gql`
      query GetNews {
          news{
              Title
              id
              Featured
              category{
                Name
                id
                news{
                  Title
                  id
                }
              }
              SubHeading
              Image{
                url
              }
              Body
                  published_at
            }
      }
  `
  
  
  export default function Homepage() {
      const { loading, error, data } = useQuery(NEWS)
      console.log(data)
      if (loading) return &lt;p&gt;Loading...&lt;/p&gt;
      if (error) return &lt;p&gt;Error :&lt;/p&gt;
      return (
          &lt;div&gt;
              &lt;SiteHeader/&gt;
              {data.news.map(new =&gt; (
                  &lt;div key={new.id} className=&quot;hello&quot;&gt;
                      &lt;div&gt;{new.Title}&lt;/div&gt;
                  &lt;/div&gt;
              ))}
          &lt;/div&gt;
      )
  }
  </code></pre>