How to Fix Module Not Found Error in Next.js: Can't Resolve '@/...
Literally, below is the error you should be getting at the moment γ·
I got the Module not found error even I've imported my component from the correct location... So how to fix this π? That's what will be discussing through this article π
Solutions !
However, first of all, make sure to check the spellings and that you've entered the exact location π
If you're using Typescript you may want to use
./srcfolderβͺ If
@/components/*doesn't work for you, it's because@/is an alias for a folder other than your root folder. A common value used for this in Next.js projects is./src/*which means Typescript is trying to find your component at./src/components/*.This also happens if there is a conflict between tsconfig and jsconfig
βͺ Which means you have created(or automatically created) both Typescript and JavaScript configuration files. So if you don't use both at once just delete the one you don't use.
Sometimes you may want to import your component by hitting Ctrl+Space
βͺ This happens to me a lot when I import my newly created components by typing by myself. So, by just deleting the import line and then hitting Ctrl+Space inside element where you trying to import the component ->
Thank you for reading this far. I hope you found the solutions helpful and that they resolve your issues with the "Module not found" error.I hope you continue to enjoy your development journey! If you have any more questions or run into other issues, feel free to reach out.
I will look forward to share more insights with you in future articles. Happy Coding π!!!