需要一個標識符，卻看到了“<”。 React.js 項目

Question

我正在創建一個簡單的電子商務 React 項目來學習，我正在使用 Visual Studio。 但是，我收到了這些錯誤：

錯誤

我的 index.js 代碼是

代碼

謝謝

Answer 1

我不確定您的文件結構如何，但是當您初始化 React 項目時，“App.js”和“index.js”應該在您的根目錄中。 然后你會import App from './App';導入應用程序作為import App from './App';

Answer 2

參考這個問題： 期望一個標識符，而是看到了 '>'

“JSHint 不支持 jsx 的 linting。如果你想使用 jsx 開發 React 應用程序，你應該禁用它或更好地切換到 ESLint。

對於 Visual Studio Code，您可以安裝一個插件。”

在您的“設置”>“用戶設置”中，如果它還沒有，請添加它。

"jshint.options": {
      "esversion":6
  }

Answer 3

如果未正確編譯 JSX，則會發生此錯誤。 參見示例：

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.3/umd/react-dom.production.min.js"></script> <div id="root"></div> <script> function App() { return ( <div>Sample Component</div> ); } ReactDOM.render(<App/>, document.getElementById("root")) </script>

要解決此問題，請使用Babel等技術啟用 JSX 語法

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.3/umd/react-dom.production.min.js"></script> <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script> <div id="root"></div> <script type="text/babel"> function App() { return ( <div>Sample Component</div> ); } ReactDOM.render(<App/>, document.getElementById("root")) </script>