0Pricing
TypeScript Academy · Lección

Alias de rutas y baseUrl

Configure paths para obtener importaciones más limpias.

Alias de rutas y baseUrl es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 3 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de TypeScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de TypeScript Academy incluye 4 lecciones en total.

Bienvenida

Los alias de rutas simplifican las rutas de importación relativas profundas y se configuran en tsconfig.

El problema de las rutas de importación

Las rutas relativas profundas como ../../../../utils son frágiles y difíciles de leer.
import { logger } from '../../../../utils/logger';
import { User } from '../../../models/user';

baseUrl

baseUrl establece la raíz para resolver importaciones no relativas.
{ "compilerOptions": { "baseUrl": "./src" } }
// Now you can import from 'utils/logger' directly

Alias de paths

paths asigna prefijos de importación a ubicaciones de directorios.
{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"], "@utils/*": ["src/utils/*"] } } }

Usar alias de rutas

Importe usando el prefijo @ en lugar de rutas relativas.
import { logger } from '@/utils/logger';
import { User } from '@/models/user';

Configuración del bundler

Los bundlers (Vite, webpack) deben configurarse por separado para resolver los alias de rutas.
// vite.config.ts
import { resolve } from 'path';
export default { resolve: { alias: { '@': resolve(__dirname, 'src') } } };

tsconfig-paths para Node

Use tsconfig-paths con ts-node para resolver alias de rutas en Node.js.
npm install tsconfig-paths
// tsconfig.json: "ts-node": { "require": ["tsconfig-paths/register"] }

Múltiples asignaciones de rutas

Defina alias para distintas partes de su proyecto.
{ "paths": { "@models/*": ["src/models/*"], "@services/*": ["src/services/*"], "@utils/*": ["src/utils/*"] } }

Rutas con comodines

El comodín * coincide con cualquier subruta.
// '@/*': ['src/*'] maps '@/foo/bar' to 'src/foo/bar'

Alias de rutas exactas

Asigne un alias de un módulo específico a un archivo específico.
{ "paths": { "@config": ["src/config/index.ts"], "@types": ["src/types/index.ts"] } }

Alias de rutas frente a archivos barrel

Use ambos conjuntamente: los alias de rutas reducen la profundidad y los archivos barrel agrupan las exportaciones.

Comprobación rápida

¿Qué establece la opción `baseUrl` de tsconfig?

Recapitulación

Alias de rutas y baseUrl: ha dominado los conceptos y patrones clave.

Preguntas frecuentes

¿La lección «Alias de rutas y baseUrl» es gratis?

Sí — el texto completo de «Alias de rutas y baseUrl» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de TypeScript Academy, actualiza a CoddyKit PRO. El curso de TypeScript Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Alias de rutas y baseUrl»?

Configure paths para obtener importaciones más limpias. Practicas TypeScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar TypeScript Academy?

No se requiere experiencia previa. TypeScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 3 de 4.

¿Cuánto tiempo toma la lección «Alias de rutas y baseUrl»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de TypeScript Academy?

Sí. Cada lección de TypeScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

  1. La opción strict y lo que habilita
  2. Configuración de módulos y target
  3. Alias de rutas y baseUrl
  4. Compilaciones incrementales y archivos de declaraciones
← Volver a TypeScript Academy