VS Code对合法React语法的JSX报错，求排查解决方法

VS Code一直把我的代码标记为错误，但我没找到语法问题，到底忽略了什么？

已尝试的操作：

• 调整右下角语言类型为"JavaScript JSX"
• 禁用所有扩展后打开文件，问题仍存在
• 重装VS Code
• 重启电脑
• 过程中快崩溃了

该文件在浏览器中能正常打开并渲染内容，代码如下：

<html>  
  <body>    
    <div id="app"></div>    
    <script src="https://unpkg.com/react@18/umd/react.development.js"></script>    
    <script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>    
    <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>    
    <script type="text/jsx">      
      const app = document.getElementById('app');      
      function Header() {        
        return (<h1>Why error?!?</h1>);      
      }      
      function HomePage() {        
        return (          
          <div>            
            <Header />          
          </div>;        
        )      
      }      
      const root = ReactDOM.createRoot(app);      
      root.render(<Header />);    
    </script>  
  </body>
</html>

问题出在HomePage函数的return语句里——<div>标签后面多了一个不必要的分号;。

浏览器里的Babel Standalone会宽容忽略这个小问题，让代码正常跑起来，但VS Code的JSX语法检测更严格，这种多余的分号属于语法冗余，会被标记为错误。

把这个分号删掉就好了，修正后的HomePage函数如下：

function HomePage() {        
  return (          
    <div>            
      <Header />          
    </div>        
  )      
}

内容的提问来源于stack exchange，提问作者Gray Griswold