我不能通过webpack导入React组件

在我的项目中，我有2个主要文件“ app.jsx”和“ Layout.jsx”。当我在“ 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);

我的代码有什么问题？