Next.js Discord

Discord Forum

Weird behavior of path define

Answered
qwrts posted this in #help-forum
Open in Discord
Avatar
Usually, when I select to use @ for defining root path it worked

example:
import Navbar from '@/components/Navbar';


but later, this method is not working anymore. like suddenly happen out of nowhere
the build error occurred and showing module not found
Image
Answered by joulev
yeah then that's why. copy the thing inside compilerOptions in jsconfig.json, paste it to the bottom of the compilerOptions in tsconfig.json
View full answer

14 Replies

Avatar
could you show your tsconfig.json?
Avatar
{
  "compilerOptions": {
    "target": "ES2017",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "noEmit": true,
    "incremental": true,
    "module": "esnext",
    "esModuleInterop": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "plugins": [
      {
        "name": "next"
      }
    ]
  },
  "include": [
    "next-env.d.ts",
    ".next/types/**/*.ts",
    "**/*.ts",
    "**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}
oh maybe because i accidentally create tsx file
Avatar
i... don't see any declaration of the absolute path @ here at all
oh you were using jsconfig.json right?
Avatar
yes
so i can just remove this file?
Avatar
yeah then that's why. copy the thing inside compilerOptions in jsconfig.json, paste it to the bottom of the compilerOptions in tsconfig.json
Answer
Avatar
then you can simply remove jsconfig.json
when both are there, tsconfig.json takes precedence and jsconfig.json is ignored
Avatar
got it. thank you so much for help
using tsconfig is okay with jsx right?
anyway i understand it now thank you a lot. problem solved
Avatar
Yeah. jsconfig is not okay with tsx, but tsconfig is okay with everything