0Pricing
TypeScript Academy · Lekcja

Aliasy ścieżek i baseUrl

Skonfiguruj ścieżki, aby uprościć importy.

Aliasy ścieżek i baseUrl to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 3 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej TypeScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Witamy

Aliasy ścieżek upraszczają głębokie względne ścieżki importu i są konfigurowane w tsconfig.

Problem ze ścieżkami importu

Głębokie ścieżki względne, takie jak ../../../../utils, są podatne na błędy i trudne do odczytania.
import { logger } from '../../../../utils/logger';
import { User } from '../../../models/user';

baseUrl

baseUrl ustawia katalog główny do rozwiązywania importów niewzględnych.
{ "compilerOptions": { "baseUrl": "./src" } }
// Now you can import from 'utils/logger' directly

Aliasy paths

paths mapuje prefiksy importów na lokalizacje katalogów.
{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"], "@utils/*": ["src/utils/*"] } } }

Używanie aliasów ścieżek

Importuj za pomocą prefiksu @ zamiast ścieżek względnych.
import { logger } from '@/utils/logger';
import { User } from '@/models/user';

Konfiguracja bundlera

Bundlery (Vite, webpack) wymagają osobnej konfiguracji do rozwiązywania aliasów ścieżek.
// vite.config.ts
import { resolve } from 'path';
export default { resolve: { alias: { '@': resolve(__dirname, 'src') } } };

tsconfig-paths dla Node

Używaj tsconfig-paths wraz z ts-node, aby rozwiązywać aliasy ścieżek w Node.js.
npm install tsconfig-paths
// tsconfig.json: "ts-node": { "require": ["tsconfig-paths/register"] }

Wiele mapowań ścieżek

Zdefiniuj aliasy dla różnych części projektu.
{ "paths": { "@models/*": ["src/models/*"], "@services/*": ["src/services/*"], "@utils/*": ["src/utils/*"] } }

Ścieżki z symbolem wieloznacznym

Symbol wieloznaczny * pasuje do dowolnej podścieżki.
// '@/*': ['src/*'] maps '@/foo/bar' to 'src/foo/bar'

Aliasy dokładnych ścieżek

Przypisz alias konkretnego modułu do konkretnego pliku.
{ "paths": { "@config": ["src/config/index.ts"], "@types": ["src/types/index.ts"] } }

Aliasy ścieżek a pliki barrel

Używaj obu rozwiązań razem: aliasy ścieżek zmniejszają głębokość, a pliki barrel agregują eksporty.

Szybki test

Co ustawia opcja `baseUrl` w tsconfig?

Podsumowanie

Aliasy ścieżek i baseUrl: opanowano kluczowe koncepcje i wzorce.

Często zadawane pytania

Czy lekcja „Aliasy ścieżek i baseUrl” jest bezpłatna?

Tak — pełny tekst „Aliasy ścieżek i baseUrl” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu TypeScript Academy, przejdź na CoddyKit PRO. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Aliasy ścieżek i baseUrl”?

Skonfiguruj ścieżki, aby uprościć importy. Ćwiczysz TypeScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć TypeScript Academy?

Nie wymagamy żadnego doświadczenia. TypeScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 3 z 4.

Ile czasu zajmuje lekcja „Aliasy ścieżek i baseUrl”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji TypeScript Academy?

Tak. Każda lekcja TypeScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Flaga strict i jej możliwości
  2. Konfiguracja modułów i celu kompilacji
  3. Aliasy ścieżek i baseUrl
  4. Kompilacje przyrostowe i pliki deklaracji
← Powrót do TypeScript Academy