title: Getting error : "react-dom.production.min.js:216 TypeError: Object(...) is not a function" while deploying react app on github pages
body: <p>I am trying to deploy my react application and its not rendering the page properly, It is throwing the below error : react-dom.production.min.js:216 TypeError: Object(...) is not a function.</p>
  <p>I have linked the screenshot of the error and the file name along with my github link of the repo.[![</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>Expense.js
  
  import { useState } from "react";
  import "../css/Expenses.css";
  import Card from "./Card";
  import ExpenseItem from "./ExpenseItem";
  import Filter from "./Filter";
  
  function Expenses(props){
      let data = props.data;
      let [year,changeYear] = useState("2021");
  
      let data2 = data.filter(function(item){
        return(new Date(item.dates).getFullYear().toString() === year);
      })
      
  
      let setFilter = function(yearValue){
        changeYear(yearValue);
      }
  
  
      return(
       &lt;Card className = "card"&gt;
       &lt;div className="filter-section"&gt;
         &lt;h3&gt;Filter By Year&lt;/h3&gt;
         &lt;Filter sendData={setFilter} yearVal = {year} className='year-filter-card'/&gt;
       &lt;/div&gt;
       &lt;div className="expense-wrap"&gt;
            {data2.length?
              data2.map(function(expItem) {
               return &lt;ExpenseItem key={Math.random()*100000} item= {expItem} deleteMe={props.deleteMe}/&gt;  
            }):
            &lt;h2 className="nodata"&gt;No Expense Data&lt;/h2&gt; 
      }
      &lt;/div&gt;
       &lt;/Card&gt;
      );
      
  }
  
  export default Expenses;</code></pre>
  </div>
  </div>
  </p>
  <p>link to my repo: <a href="https://github.com/AbhishekTomr/money-tracker" rel="nofollow noreferrer">https://github.com/AbhishekTomr/money-tracker</a></p>