Tutorial de TRAE

Trae (pronunciado /treɪ/) es un entorno de desarrollo integrado (IDE) nativo de IA creado por ByteDance. Integra profundamente grandes modelos como Claude y GPT-4o, y ofrece capacidades de preguntas y respuestas inteligentes, autocompletado de código y programación automática con IA.

Trae está desarrollado sobre el núcleo de VS Code, con una interfaz amigable y un usoVS Codecasi igual.

Las principales características de Trae incluyen:

  • Interfaz totalmente en chino, sin necesidad de instalar extensiones de localización, lista para usar
  • Asistente de IA integrado, compatible con dos modos: Chat (preguntas y respuestas) y Builder (construcción de proyectos)
  • Compatible con el ecosistema de VS Code, permite importar extensiones, atajos de teclado y archivos de configuración con un solo clic
  • Compatibilidad multiplataforma: Windows y macOS; la versión para Linux se puede reservar
  • Totalmente gratuito, no se requiere suscripción de pago para usar las funciones de IA

Instalar Trae

1. Descargar el paquete de instalación

Visita el sitio web oficial de Trae en China: Sitio web oficial de Trae

El sitio web oficial detectará automáticamente tu sistema operativo y recomendará la versión correspondiente. También puedes elegir manualmente:

Sistema operativo Versión de descarga
Windows .exePaquete de instalación
macOS（Intel） .dmgPaquete de instalación
macOS（Apple Silicon） .dmgVersión ARM

2. Pasos de instalación

Una vez completada la descarga, haz doble clic en el paquete de instalación y sigue las indicaciones para completar la instalación. Todo el proceso es igual que instalar un software normal y se completa en aproximadamente 1 o 2 minutos.

3. Configuración inicial

Al iniciar Trae por primera vez, aparecerá el asistente de configuración inicial:

Primer paso: elegir el tema
Las opciones son «Oscuro», «Claro» o «Azul profundo». Elige según tu preferencia; puedes cambiarlo más adelante en la configuración en cualquier momento.

Segundo paso: elegir el idioma de la interfaz
Puedes elegir «Chino simplificado» o «English». Los desarrolladores chinos pueden seleccionar directamente chino simplificado y la interfaz se mostrará completamente localizada.

Tercer paso: migrar la configuración existente (opcional)
Si antes usabas VS Code o Cursor, puedes hacer clic en «Importar desde VS Code» o «Importar desde Cursor», y Trae sincronizará automáticamente:

  • Las extensiones instaladas
  • La configuración y preferencias del IDE
  • Los atajos de teclado

Esto te permite cambiar de tus herramientas anteriores a Trae casi sin fricción, con un costo de aprendizaje muy bajo.

Cuarto paso: instalar la herramienta de línea de comandos (recomendado)
Haz clic en «Instalartraecomando» y, después de completar la autorización, puedes usar los siguientes comandos en la terminal:

# 快速唤起 Trae
trae

# 在 Trae 中打开指定项目
trae my-react-app

Quinto paso: iniciar sesión con tu cuenta
Inicia sesión con tu número de teléfono o con tu cuenta de Juejin (稀土掘金). Después de iniciar sesión, podrás usar los servicios de IA en Trae.

Disposición de la interfaz

La interfaz de Trae es muy similar a la de VS Code y se divide principalmente en las siguientes áreas:

┌─────────────────────────────────────────────┐
│  菜单栏（文件 / 编辑 / 视图 / 帮助…）            │
├──────┬──────────────────────┬───────────────┤
│      │                      │               │
│ 侧边栏│    代码编辑区          │  AI 助手面板  │
│      │                      │               │
│（文件 │                      │（Chat / Builder│
│ 资源  │                      │  对话界面）    │
│ 管理器│                      │               │
│ 等）  │                      │               │
├──────┴──────────────────────┴───────────────┤
│  终端（底部面板）                               │
└─────────────────────────────────────────────┘

  • Barra lateral: explorador de archivos, búsqueda, control de versiones, mercado de extensiones, etc.
  • Área de edición de código: la zona principal para escribir código, con resaltado de sintaxis y pestañas para múltiples archivos
  • Panel del asistente de IA: el área de interacción con IA en el lado derecho, compatible con los modos Chat y Builder
  • Panel de terminal: terminal integrada en la parte inferior, donde puedes ejecutar comandos directamente

Abrir y gestionar proyectos

Abrir un proyecto existente

Existen varias formas de hacerlo:

  • En la barra de menú, selecciona «Archivo» → «Abrir carpeta» y elige el directorio del proyecto local.
  • Ejecuta en la terminaltrae ruta-del-proyectopara abrirlo directamente.
  • Selecciona «Proyectos recientes» en la página de bienvenida.

Para usar Trae desde la terminal, utiliza los siguientes comandos:

trae

Comando para abrir el directorio actual con Trae:

trae .

Para especificar una ruta de directorio, usa el siguiente comando:

trae ~/ejemplo-test     # 打开指定目录的项目

Clonar un repositorio Git

En la página de bienvenida, haz clic en «Clonar repositorio Git», introduce la URL del repositorio y el proyecto remoto se descargará a tu máquina y se abrirá automáticamente.

Crear archivos y proyectos

  • Haz clic derecho en una carpeta del explorador de archivos → «Nuevo archivo». Trae reconocerá automáticamente el tipo según la extensión del archivo.
  • En la barra de menú, «Archivo» → «Nuevo proyecto»; puedes elegir un proyecto en blanco o generarlo con IA mediante el modo Builder.

Usar el asistente de IA

Esta es la función más importante de Trae y ofrece dos modos:

Modo Chat (Preguntas y respuestas inteligentes)

El modo Chat es adecuado para hacer preguntas en cualquier momento durante el desarrollo; es un «compañero inteligente» para entender el código actual.

Usos comunes:

  • Explicar la función de un fragmento de código
  • Encontrar errores (bugs) y dar soluciones de reparación
  • Preguntar sobre el uso de una API
  • Pedir a la IA que te ayude a optimizar la lógica del código

Cómo usar el contexto:

Al conversar con la IA, puedes especificar código, archivos o carpetas como contexto para que las respuestas sean más precisas. Por ejemplo, en el campo de entrada de Chat usa@nombre de archivopara hacer referencia a un archivo específico.

Modo Builder (Construcción de proyectos)

El modo Builder es adecuado para crear un proyecto desde cero. Solo tienes que describir en lenguaje natural qué aplicación deseas; la IA invocará herramientas automáticamente, analizará los requisitos, generará archivos y ejecutará comandos.

Ejemplo de uso:

请帮我创建一个 React 待办事项应用，支持添加、删除和标记完成功能

El modo Builder automáticamente:

  1. Crea la estructura de directorios del proyecto
  2. Genera todos los archivos de código necesarios
  3. Instala los paquetes de dependencias
  4. Ejecuta el proyecto para obtener una vista previa

Nota (para usuarios de Windows): para usar el modo Builder, necesitas configurar PowerShell 6 o superior. En «Configuración» → perfiles de terminal, elige la opción que contenga\PowerShell\{版本号}\la etiqueta correspondiente.

Gestionar los cambios de código generados por IA

Después de que la IA genere código, puedes elegir aceptarlo o rechazarlo:

Acción Atajo de teclado en macOS Atajo de teclado en Windows
Aceptar todos los cambios en el archivo actual Command + Enter Ctrl + Enter
Rechazar todos los cambios en el archivo actual Command + Backspace Ctrl + Backspace
Aceptar todos los cambios en lote Haz clic en el botón «Aceptar todo» sobre el campo de entrada Igual que a la izquierda
Rechazar todos los cambios en lote Haz clic en el botón «Rechazar todo» sobre el campo de entrada Igual que a la izquierda

Chat integrado (Inline Chat)

Además del panel de IA lateral, también puedes invocar a la IA directamente en el editor:

  • Atajo de teclado：Command + I（macOS）/ Ctrl + I（Windows）
  • Selecciona un fragmento de código y pulsa el atajo de teclado para hacer preguntas o solicitar modificaciones sobre la selección.
  • Cuando el código muestre un error, también puedes hacer clic en el botón «Reparar con IA» junto al mensaje de error para que la IA lo analice y lo corrija automáticamente.

Autocompletado de código

Trae incluye autocompletado de código con IA que ofrece sugerencias en tiempo real mientras escribes código. No requiere configuración adicional; está disponible al abrir un proyecto:

  • Cuando la IA ofrezca una sugerencia de autocompletado, pulsaTabla tecla para aceptarla
  • segúnEscla tecla para ignorar la sugerencia
  • El alcance del autocompletado incluye líneas de código individuales, funciones completas e incluso lógica entre archivos.

Gestión de extensiones

Trae es compatible con el ecosistema de extensiones de VS Code. Para instalar extensiones:

  • Haz clic en el icono «Extensiones» de la barra lateral izquierda (o pulsaCtrl+Shift+X）
  • el atajo de teclado correspondiente) y escribe el nombre de la extensión en el cuadro de búsqueda; a continuación, haz clic en «Instalar».
  • Si ya has importado la configuración desde VS Code, las extensiones existentes se sincronizarán automáticamente, sin necesidad de reinstalarlas.

Control de versiones

Trae tiene integración de Git incorporada. El panel «Control de código fuente» de la barra lateral ofrece operaciones visuales de control de versiones:

  • Ver cambios de archivos, preparar archivos
  • Confirmar código, enviar/extraer repositorio remoto
  • Ver historial de commits y comparación de Diff

Para desarrolladores acostumbrados a la línea de comandos, la terminal integrada en la parte inferior también puede ejecutar comandos Git directamente.

Configuración personalizada

Cambiar tema e idioma

«Configuración» → «General» → «Preferencias», se puede modificar el tema de la interfaz y el idioma de visualización.

Personalizar atajos de teclado

«Configuración» → «General» → «Preferencias» → «Configuración de atajos de teclado», se pueden agregar, modificar o eliminar asignaciones de atajos de teclado.

Configuración relacionada con IA

«Configuración» → «Modelo», se pueden configurar opciones como el modelo utilizado.

Otras extensiones