React Module not found:

azertymlkjh 0
Viewed 37

I'm just starting a project with the npx create-react-app, so far I only changed files in src folder. Here is the result of tree src command

src
├── components
│   └── App.js
├── index.css
└── index.js

But when I try to run my project I get:

       Failed to compile.
    
    Module not found: Error: Can't resolve './logo.svg' in '/home/mta/react/la-maison-jungle/src/components'
    ERROR in ./src/components/App.js 4:0-30
    Module not found: Error: Can't resolve './logo.svg' in '/home/mta/react/la-maison-jungle/src/components'

webpack compiled with 1 error

EDIT: Thnak for you're help, I somehow copy/paste the wrong error message, it's this one I'm struggling with:

Module not found: Error: Can't resolve '.components/App' in '/home/mta/react/la-maison-jungle/src'
ERROR in ./src/index.js 7:0-34
Module not found: Error: Can't resolve '.components/App' in '/home/mta/react/la-maison-jungle/src'

webpack compiled with 1 error

Is it beacause I deleted App.ccs ? Here is is my App.js ins src/components:

//import '.App.css';

function App() {
  return (
    <div className="App">
      <header className="App-header">
      </header>
    </div>
  );
}

export default App;

(i alreadt try to uncomment the import )

And here my index.js in src:

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from '.components/App';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);
reactjs
4 Answers

In your App.js file, there is a line to import the logo.

import Logo from "./logo.svg";

Since you moved the file inside the components folder, either you need to move the logo.svg to the same folder, you need to change the import path of the logo.svg like this:

import Logo from "../logo.svg"
Mahesh Samudra0

since you moved your App.js to components folder, the ./logo.svg inside App.js route doesn't match now...that's why you're getting that error

buzz0

the relative path is wrong,'./components/App' will be right

tkiddo0

The problem rises as a result that you moved the App.js file to the Component folder. You need to move it back to src folder, that is how reactjs is structure by default. If you still want to go ahead and use the App.js in the new folder then you'd have to change relative paths from index.js.

import App from './components/App';
mintiverse mintiverse0
Related