TypeScript Academy · درس

الأسماء المستعارة للمسارات وbaseUrl

اضبطوا المسارات لاستيرادات أكثر وضوحًا

الدرس 3 من 413 خطوة

الأسماء المستعارة للمسارات وbaseUrl درس مجاني في TypeScript Academy على CoddyKit. هذا هو الدرس 3 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في TypeScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة TypeScript Academy 4 دروس في المجموع.

مرحبًا

تُبسّط الأسماء المستعارة للمسارات مسارات الاستيراد النسبية العميقة، ويتم إعدادها في tsconfig.

مشكلة مسار الاستيراد

المسارات النسبية العميقة مثل ../../../../utils هشة وصعبة القراءة.
import { logger } from '../../../../utils/logger';
import { User } from '../../../models/user';

baseUrl

يحدد baseUrl الجذر لحل الاستيرادات غير النسبية.
{ "compilerOptions": { "baseUrl": "./src" } }
// Now you can import from 'utils/logger' directly

الأسماء المستعارة في paths

يربط paths بادئات الاستيراد بمواقع المجلدات.
{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"], "@utils/*": ["src/utils/*"] } } }

استخدام الأسماء المستعارة للمسارات

استورد باستخدام البادئة @ بدلًا من المسارات النسبية.
import { logger } from '@/utils/logger';
import { User } from '@/models/user';

إعداد أداة التجميع

تحتاج أدوات التجميع مثل Vite وwebpack إلى إعداد منفصل لحل الأسماء المستعارة للمسارات.
// vite.config.ts
import { resolve } from 'path';
export default { resolve: { alias: { '@': resolve(__dirname, 'src') } } };

tsconfig-paths مع Node

استخدم tsconfig-paths مع ts-node لحل الأسماء المستعارة للمسارات في Node.js.
npm install tsconfig-paths
// tsconfig.json: "ts-node": { "require": ["tsconfig-paths/register"] }

تعيينات مسارات متعددة

عرّف أسماء مستعارة لأجزاء مختلفة من مشروعك.
{ "paths": { "@models/*": ["src/models/*"], "@services/*": ["src/services/*"], "@utils/*": ["src/utils/*"] } }

المسارات ذات الرموز البديلة

يطابق الرمز البديل * أي مسار فرعي.
// '@/*': ['src/*'] maps '@/foo/bar' to 'src/foo/bar'

الأسماء المستعارة للمسارات المحددة

أنشئ اسمًا مستعارًا لوحدة محددة يشير إلى ملف محدد.
{ "paths": { "@config": ["src/config/index.ts"], "@types": ["src/types/index.ts"] } }

الأسماء المستعارة للمسارات مقابل ملفات Barrel

استخدمهما معًا: تقلل الأسماء المستعارة للمسارات عمق المسار، بينما تجمع ملفات Barrel عمليات التصدير.

تحقق سريع

ما الذي يحدده الخيار `baseUrl` في tsconfig؟

مراجعة

الأسماء المستعارة للمسارات وbaseUrl: أتقنتم المفاهيم والأنماط الأساسية.
البدء مجانًا

تعلم TypeScript مع معلم ذكاء اصطناعي — مجانًا

اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.

الدورات
101
الدروس
352

الأسئلة الشائعة

هل درس «الأسماء المستعارة للمسارات وbaseUrl» مجاني؟

نعم — نص درس «الأسماء المستعارة للمسارات وbaseUrl» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة TypeScript Academy، انتقل إلى CoddyKit PRO. تتضمن دورة TypeScript Academy 4 دروس في المجموع.

ماذا ستتعلم في «الأسماء المستعارة للمسارات وbaseUrl»؟

اضبطوا المسارات لاستيرادات أكثر وضوحًا تتمرن على TypeScript Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ TypeScript Academy؟

لا تُشترط خبرة سابقة. TypeScript Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 4.

كم من الوقت يستغرق درس «الأسماء المستعارة للمسارات وbaseUrl»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس TypeScript Academy هذا؟

نعم. كل درس في TypeScript Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. العلامة strict وما تتيحه
  2. إعداد الوحدات والهدف
  3. الأسماء المستعارة للمسارات وbaseUrl
  4. البنيات التزايدية وملفات التصريحات
← العودة إلى TypeScript Academy