按照Sanity+React博客教程操作编译失败,提示无法找到AllPosts.js模块
报错排查解决思路
- 检查文件路径与大小写匹配度
首先确认components文件夹确实放在src根目录下,而非与src平级;其次核对AllPosts.js文件名的大小写、拼写完全和导入语句一致,MacOS文件系统默认大小写不敏感,但React编译工具对路径大小写敏感,类似allPosts.js、Allposts.js的名称都会触发报错;最后确认文件后缀确实为.js,没有出现.js.txt这类隐藏后缀,也没有误存为.jsx格式未同步修改导入语句。 - 核对App.js的导入语句写法
确认导入语句格式正确,示例正确写法为import AllPosts from './components/AllPosts.js',检查是否出现路径拼写错误,比如少写components的s、多写多余层级、斜杠符号错误等;如果你的文件后缀为.jsx,可以去掉导入语句里的后缀,改为import AllPosts from './components/AllPosts'让编译工具自动匹配支持的后缀格式。 - 确认文件实际存放位置
打开本地项目的/Users/ablair/sanity-react/src/components路径,确认AllPosts.js确实存放在该目录下,没有被误挪到其他子文件夹、或者被删除、重命名。 - 清理缓存重启开发服务
部分情况是开发服务缓存异常导致路径识别失败,可以先停掉正在运行的本地开发服务,删除node_modules/.cache文件夹后,重新执行启动命令即可。
内容的提问来源于stack exchange,提问作者ABlair
相关产品推荐
相关产品推荐

