Next.js Discord

Discord Forum

tsconfig paths not resolving as expected

Unanswered
Giant panda posted this in #help-forum
Open in Discord
Giant pandaOP
Here's my project structure
├── src
│   ├── app
│   │   ├── (buyer)
│   │   ├── (login)
│   │   ├── (vendor)
│   │   ├── api
│   │   ├── layout.tsx
│   │   ├── page.module.css
│   │   ├── page.tsx
│   │   └── providers.tsx
│   ├── constants
│   │   └── next-auth.ts
├── tailwind.config.js
├── tsconfig.json
└── tsconfig.spec.json


When building this app, I'm running into "cannot find module" errors, mostly complaining about paths not being resolved.

For example:
Failed to compile.
       
       ../project-name/src/app/(buyer)/user/page.tsx:4:25
       Type error: Cannot find module '@/constants/next-auth' or its corresponding type declarations.
       
         2 | import { getServerSession } from 'next-auth'
         3 | 
       > 4 | import { OPTIONS } from '@/constants/next-auth'
           |                         ^
         5 | import { Session } from 'next-auth/core/types'
         6 | 
         7 | const User = async () => {
       Error occurred while trying to run the npx next build 
       Error: Command failed: npx next build 


The compiler is complaining that there is no path pointing to this module. Let's check the tsconfig.json:

{
    //"extends": "../../tsconfig.base.json",
    "compilerOptions": {
      "baseUrl": ".",
       ...
      "plugins": [
        {
          "name": "next"
        }
      ],
      "paths": {
        "@/*": ["./src/*"],
        "@/app/*": ["./src/app/*"],
        "@/constants/*": ["./src/constants/*"],
        ...
      },
    },
    "include": [
      "next-env.d.ts",
      "**/*.ts",
      "**/*.tsx",
      ...
    ],
    "exclude": [
      "node_modules",
      "jest.config.ts",
      "src/**/*.{spec,test}.ts"
    ]
}

I know I'm missing something, but I'm not exactly sure what.
Thanks in advance for your help!

6 Replies

Sokoke
have you tried removing the src
parent folder?
put app contants and any other folder under at the root level
Giant pandaOP
unfortunately i've tried it and i'm still running in the same problems
Tomistoma
"paths": {
        "@/*": ["src/*"],
        "@/app/*": ["src/app/*"],
        "@/constants/*": ["src/constants/*"],
        ...
      },
remove the relative path, you have already defined the base url
Giant pandaOP
this does seem to be the problem... but why would it be "incorrect"? it's ridiculous