DEV Community

Alexander Kim
Alexander Kim

Posted on

Path aliases in Nextjs

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.

Top comments (0)