Abdelaziz Mokhnache Abdelaziz Mokhnache - 1 month ago 4x
React JSX Question

I can't import React components with webpack

in my project I have 2 main files "app.jsx" and "Layout.jsx". When I define my Layout component inside my "app.jsx", it renders successfully. But, when I move it to "Layout.jsx" and require it from "app.jsx" it doesn't work.
here is my code:


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


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

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

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

What's wrong in my code ?


on your layout.jsx file you need to import

const React = require("react");