CODEWITHSUNDEEP
reactjs
Shell Shocker
Shell Shocker

Reputation: 3

React Module Not Found, I've never had this problem

I can't import my module, it keeps giving me the same error, I have looked into what I may have done wrong but I dont see it. Everything works for my other components (They are all in the same folder "./[Folder]") except this component and it's being passed the exact same way.

Module Not Found

ManageTreeComponent.jsx

import React from "./react";
function DisplayListItems(){
  
    return(
        <h1>Hello</h1>
    );
  }
  
  export default DisplayListItems;

LoginApp.jsx

import DisplayListItems from "./ManageTreeComponent.jsx";

function Login() {

  return <div className="container">
    <DisplayListItems /> 
  </div>
}

export default Login;

index.js

import Login from "./components/Login/LoginApp";
ReactDOM.render(<div>
<Login />
</div>, document.getElementById("root"));

Upvotes: 0

Views: 43

Answers (2)

Kiran B
Kiran B

Reputation: 80

Rather then using .jsx file use .js file

ManageTreeComponent.js

import React from "react"; // need to import like this

function DisplayListItems(){

    return(
        <h1>Hello</h1>
    );
  }
  export default DisplayListItems

LoginApp.js

import DisplayListItems from "./ManageTreeComponent";

function Login() {

  return (
       <div className="container">
         <DisplayListItems /> 
     </div>
    );
}

export default Login;

index.js

import Login from "./components/Login/LoginApp";
ReactDOM.render(<div>
<Login />
</div>, document.getElementById("root"));

Upvotes: 0

Aadil Mehraj
Aadil Mehraj

Reputation: 2614

Your import react statement is wrong in ManageTreeComponent.jsx, make sure your import looks like this:

import React from "react"; // without period and /

Upvotes: 3

Related Questions