Title: Module not found: Can't resolve './pages
Tags: reactjs
Question: I'm having issues that I've never experienced before. Recently, I've started a new project with create-react-app however, I'm shown an error:
./src/App.js
Module not found: Can't resolve './pages/' in '
Folder Structure
I've tried different file paths but in my previous projects this is the path that has worked but for some reason, it doesn't work anymore.
App.js
import React from 'react';
import Home from './pages'
function App() {
return (
<div&gt;
<h1&gt;Hello</h1&gt;
<Home /&gt;
</div&gt;
export default App;
Home.js
import React from 'react'
export const Home = () =&gt; {
return (
<div&gt;
<h1&gt;Hello</h1&gt;
</div&gt;
If someone could help that would be great! I've been trying to solve this for the past 3hrs and nothing has come from it! Thanks in advance!
Comment: what's inside the pages folder? Do you have file called pages? you should separate your Home component as a separate file

Comment: Hey @FahimHoque inside my pages folder is two files Home.js and About.js.

Here is the accepted answer: The reason you're code is failing is because the pages folder doesn't have an index.js file. If you want to import the Home page component directly from the pages folder, without using import Home from &quot;./pages/home&quot; syntax, you'll have to create an index.js file, inside the pages directory, that exports the home component, like this:
&quot;./pages/index.js&quot;
export * from './home';
export * from './someOtherPage';
Then, in App.js, you can import the Home component like this:
import { Home, SomeOtherComponent } from './pages';
Comment for this answer: Anytime! BTW, the code that you were trying to use ( `export { Home, About }...`) will only work when Home and About components are being exported from the same file :)
Comment for this answer: Thanks! Yes so I forgot to add the index.js file in the pages folder. I also tried
export { Home, About} but that didn't work but yours did! Thanks again!
Comment for this answer: Seems so simple! haha its been 3 months since I last touched React so I put it down to being out of touch :)

Here is another answer: Try './pages/Home' instead of './pages'

Here is another answer: What you've imported as ./pages is actually the folder when you need to import the file itself. So it should be something like this:
import React from 'react';
import Home from './pages/Home.js'
function App() {
return (
<div&gt;
<h1&gt;Hello</h1&gt;
<Home /&gt;
</div&gt;
export default App;

{'source': 'StackExchangeDataset', 'subset': 'stackoverflow.com', 'metadata': {'AnswerCount': 3, 'CommentCount': 2, 'ContentLicense': 'CC BY-SA 4.0', 'CreationDate': '2021:00:04/03/21', 'FavoriteCount': None, 'PostTypeId': 1, 'Tags': '<reactjs>', 'Title': "Module not found: Can't resolve './pages", 'ViewCount': 755, 'id': 66935299, 'user_AboutMe': None, 'user_AccountId': 21145774.0, 'user_DisplayName': 'JoshH', 'user_Reputation': 3.0, 'user_Views': 1.0, 'user_id': 15547146.0}}