Path aliases in Nextjs

Alexander Kim - Dec 18 '21 - - Dev Community

Tired of writing such imports?

import test from '../../../components/Test.tsx';
Enter fullscreen mode Exit fullscreen mode

If you're using a typescript, you can create a path alias instead:

{
  "compilerOptions": {
    "baseUrl": "src",
    "paths": {
      "@/*": ["./*"] 
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Then you can import more conveniently:

import test from '@/components/Test.tsx';
Enter fullscreen mode Exit fullscreen mode

Don't forget to restart your running task to affect changes.

. . . . . . . .
Terabox Video Player