فریمورک Next.js به صورت پیشفرض و داخلی از گزینههای "baseUrl" و "paths" در فایلهای تنظیمات tsconfig.json یا jsconfig.json پشتیبانی میکند.
این قابلیت به شما اجازه میدهد تا برای پوشههای مختلف پروژه خود، نامهای مستعار (Alias) یا مسیرهای مطلق تعریف کنید. با این کار، دیگر نیازی به نوشتن آدرسهای نسبی طولانی و پیچیده نخواهد بود و فرآیند واردسازی ماژولها بسیار تمیزتر انجام میشود.
به تفاوت زیر نگاه کنید:
// واردسازی با مسیر نسبی قدیمی (قبل از اعمال تنظیمات)
import { Button } from '../../../components/button'
// واردسازی با مسیر مطلق و خوانا (بعد از اعمال تنظیمات)
import { Button } from '@/components/button'
برای شروع پیکربندی مسیرهای مطلق، ابتدا باید گزینه baseUrl را در فایل تنظیمات tsconfig.json (برای پروژههای TypeScript) یا jsconfig.json (برای پروژههای JavaScript) اضافه کنید. این گزینه، نقطه مبدأ آدرسدهیهای شما را مشخص میکند:
{
"compilerOptions": {
"baseUrl": "src/"
}
}
علاوه بر مشخص کردن مسیر پایه، شما میتوانید با استفاده از گزینه "paths"، نامهای مستعار دقیقی را برای پوشههای مختلف تعریف کنید.
به عنوان نمونه، پیکربندی زیر عبارت /*@/components را به پوشه واقعی /*components نگاشت (Map) میکند:
{
"compilerOptions": {
"baseUrl": "src/",
"paths": {
"@/styles/*": ["styles/*"],
"@/components/*": ["components/*"]
}
}
}
قانون کلیدی: در نظر داشته باشید که تمامی آدرسهای تعریفشده در بخش
"paths"، کاملاً نسبی و وابسته به مکان مشخصشده در"baseUrl"پردازش میشوند.
این محتوا کاملا رایگان توسط تیم کدلپر ترجمه شده و در اختیار شما کاربران عزیز قرار گرفته است، هر گونه کپی برداری برای مقاصد غیر رایگان و بدون ذکر منبع، مورد پیگیری قانونی قرار میگیرد.
ترجمه شده از منبع: https://nextjs.org/docs/app