0Pricing
TypeScript Academy · Урок

Псевдонимы путей и baseUrl

Настройте пути для более удобных импортов

«Псевдонимы путей и 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"] } }

Псевдонимы путей и файлы-агрегаторы

Используйте их вместе: псевдонимы путей уменьшают глубину, а файлы-агрегаторы объединяют экспортируемые сущности.

Быстрая проверка

Что задаёт параметр `baseUrl` в tsconfig?

Итоги

Псевдонимы путей и baseUrl: вы освоили основные понятия и паттерны.

Часто задаваемые вопросы

Урок «Псевдонимы путей и 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 включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Флаг strict и его возможности
  2. Настройка модулей и целевой среды
  3. Псевдонимы путей и baseUrl
  4. Инкрементальные сборки и файлы объявлений
← Назад к TypeScript Academy