Я не могу импортировать компоненты React с webpack

Question

в моем проекте У меня есть 2 основных файла «app.jsx» и «Layout.jsx». Когда я определяю свой компонент Layout внутри своего «app.jsx», он успешно отображается. Но, когда я перехожу к «Layout.jsx» и требую от «app.jsx», он не работает. вот мой код:

"Layout.jsx"

module.exports = class Layout extends React.Component { 
    render() { 
     return(
      <h3>Layout Component</h3> 
     ) 
    } 
} 

"app.jsx"

const React = require("react"); 
const ReactDOM = require("react-dom"); 

const Layout = require("./pages/Layout.jsx"); 

const App = document.getElementById("app"); 
ReactDOM.render(<Layout />, App); 

Что плохого в моем коде?

Answer 1

на вашем layout.jsx файл вам нужно импортировать

const React = require("react");