React项目导入pages组件报错：Module not found: Can't resolve './pages'

嘿，我来帮你搞定这个报错～ 你遇到的问题原因其实很清晰：当你写import Home from "./pages"时，React会默认去pages文件夹里找名为index.js的文件作为该文件夹的入口模块，但你的组件文件是home.js，所以它找不到对应的模块，自然就抛出了错误。

这里有两个简单可行的解决方案：

方案1：直接指定组件文件路径 #

修改App.js里的导入语句，明确指向pages文件夹内的home.js文件：

// 将原来的导入行替换成下面这样
import Home from "./pages/home.js";

小提醒：如果你的系统是Linux或macOS，文件名是大小写敏感的——要是你的组件实际文件名是Home.js（首字母大写），那导入路径也要写成./pages/Home.js，否则同样会触发找不到模块的错误。

方案2：创建文件夹索引文件 #

如果你想保留import Home from "./pages"这种简洁的写法，可以在pages文件夹里新建一个index.js文件，然后在这个文件里导出你的Home组件：

// pages/index.js 文件内容
import Home from './home.js';
export default Home;

这样React在解析./pages路径时，就会自动加载这个index.js文件，进而找到你的Home组件，原来的导入语句就能正常工作了。

另外，我注意到你App.js里的路由有重复的/browse路径，虽然这不是当前报错的原因，但后续可能会导致路由匹配异常，建议你调整一下哦～

内容的提问来源于stack exchange，提问作者Sambulo Senda