Error when the browser opens Ravenous part 1

./src/components/App/App.jsModule not found: Can't resolve './component/BusinessList/BusinessList' in 'C:\Users\hdemirci\ravenousproject\ravenous\src\components\App'   

<I did some adjustments looking at other posts and now i get this.>

./src/components/App/App.js
Module not found: You attempted to import /Users/hdemirci/ravenousproject/src/components/SearchBar/SearchBar which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.

here is what is in my App.js in vscode

type or paste code here
import React from 'react';
import logo from './public/favicon.ico';
import './App.css';
import SearchBar from '/Users/hdemirci/ravenousproject/src/components/SearchBar/SearchBar';
import BusinessList from '/Users/hdemirci/ravenousproject/src/components/SearchBar/SearchBar';

class App extends React.Component {
  render(){

  return (
    <div className="App">
  <h1>ravenous</h1>
  <SearchBar />
  <BusinessList /> 
    </div>
  );

  }
}
export default App;

I was doing fine I though then at the end, it didn't come together.
I don't know how to fix the error.

Hello @hdemirci84,your import statements should change to

import SearchBar from '../SearchBar/SearchBar';
and
import BusinessList from '../BusinessList/BusinessList'

You didn’t have to use the full path.
Also, make sure to remove the import logo from './public/favicon.ico statement as that variable is not being used anywhere

Hope this helps you! :slightly_smiling_face:

Hi everyone,

I cannot not for the life of me figure out what is wrong with my code. I feel like I am importing everything correctly:

import React from 'react';
import './App.css';
import BusinessList from '../BusinessList/BusinessList';
import SearchBar from '../SearchBar/SearchBar';

class App extends React.Component {
  render() {
    return (
      <div className="App">
        <h1>ravenous</h1>
        <SearchBar />
        <BusinessList /> 
      </div>
    );
  }
};

export default App;

It is still giving me an error of :

Failed to Compile
./src/components/App/App.jsModule not found: Can't resolve '../SearchBar/SearchBar' in '/Users/Adam/Documents/Web Development/ravenous/src/components/App'

Hello Adam, hello everyone,

I’m having exactly the same trouble and my code looks exactly the same as yours, Adam! I have checked the solution code and I see no differences.
Have you managed to find a solution to the problem yet? Has anyone?
Thanks,

Michela

And as soon as I decide to post, I manage to figure it out…There was an error in the css we had to copy and paste onto the SearchBar.css file. It was in the file path of the desktop image, which ended in .jpg, instead of .webp. At least, that fixed it for me.

Michela