Generador de tsconfig.json
tsconfig.json tiene bastante más de cien opciones de compilador y cada tutorial de TypeScript enseña una combinación distinta. Este generador se ciñe a las que importan en la mayoría de proyectos: target, module, moduleResolution, jsx, los flags booleanos habituales (strict, esModuleInterop, skipLibCheck y compañía) y las carpetas outDir/rootDir. La vista previa del tsconfig.json se actualiza en vivo con cada cambio; cópiala a la raíz de tu proyecto y tendrás una configuración limpia sin las opciones muertas que arrastran la mayoría de plantillas.
Cómo se construye la configuración
-
1
Elige target y module
La versión de JavaScript que emite tsc (de ES2015 a ES2023, o ESNext) y el sistema de módulos (CommonJS, ES2015/ES2020/ES2022, ESNext, Node16, NodeNext).
-
2
Define moduleResolution y JSX
bundler para proyectos con Vite/webpack, node16/nodenext para Node moderno, node o classic para montajes antiguos. Pon jsx en react-jsx para React moderno o déjalo en none para omitir la clave.
-
3
Activa o desactiva los flags
strict, esModuleInterop, skipLibCheck, resolveJsonModule, allowJs, declaration, sourceMap y forceConsistentCasingInFileNames como simples casillas.
-
4
Fija las carpetas
outDir y rootDir, preconfiguradas a ./dist y ./src. include y exclude quedan fijos en src/**/* más node_modules y dist.
-
5
Copia el tsconfig generado
La vista previa JSON se actualiza en vivo; un clic la copia, lista para colocarla como tsconfig.json en la raíz del proyecto.
Las opciones que escribe este generador
| Opción | Valor por defecto aquí | Qué hace |
|---|---|---|
target |
ES2022 |
Versión de JavaScript del código emitido. ES2022 es segura para navegadores y Node actuales; elige un target más antiguo solo para entornos legados. |
module |
ESNext |
Sintaxis de módulos de la salida. Usa NodeNext/Node16 para proyectos Node con ESM y CommonJS para Node legado. |
moduleResolution |
node |
Cómo se localizan los imports. Prefiere bundler con Vite/webpack/esbuild y node16/nodenext con Node moderno; node (node10) es el comportamiento clásico. |
jsx |
omitida | Solo se escribe si eliges un modo. react-jsx para React 17+, preserve cuando un bundler transforma el JSX. |
strict |
true |
Activa toda la familia de comprobaciones estrictas. Déjalo activado en proyectos nuevos. |
esModuleInterop |
true |
Arregla los imports por defecto de paquetes CommonJS. |
skipLibCheck |
true |
Omite la comprobación de tipos de los .d.ts; compila mucho más rápido y rara vez oculta errores reales. |
forceConsistentCasingInFileNames |
true |
Rechaza imports cuya capitalización no coincide con el archivo en disco (la rotura clásica al pasar de macOS a Linux). |
resolveJsonModule |
true |
Permite import data from "./data.json". |
allowJs |
false |
Admite archivos .js en la compilación; útil a mitad de una migración. |
declaration |
false |
Emite archivos .d.ts; actívalo al publicar una librería. |
sourceMap |
false |
Emite archivos .js.map para depurar. |
outDir / rootDir |
./dist / ./src |
Dónde va el código compilado y dónde viven las fuentes. |
baseUrl |
"." |
Se escribe siempre, de modo que un bloque paths añadido a mano se resuelva desde la raíz del proyecto. |
La salida por defecto exacta
Deja todos los controles como están y este es el archivo que obtienes:
{
"compilerOptions": {
"target": "ES2022",
"module": "ESNext",
"moduleResolution": "node",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"allowJs": false,
"declaration": false,
"sourceMap": false,
"outDir": "./dist",
"rootDir": "./src",
"baseUrl": "."
},
"include": [
"src/**/*"
],
"exclude": [
"node_modules",
"dist"
]
}
Si eliges un modo jsx distinto de none, se añade una entrada "jsx" a compilerOptions.
Modo estricto: qué activa realmente
strict: true es un flag paraguas que enciende toda la familia estricta, incluidos noImplicitAny, strictNullChecks, strictFunctionTypes, strictBindCallApply, strictPropertyInitialization, noImplicitThis, useUnknownInCatchVariables y alwaysStrict. Los proyectos nuevos deberían empezar con todos activados: añadir rigor después es doloroso.
Errores comunes
- Poner
module: "CommonJS"en un proyecto Node con ESM. Si tupackage.jsondice"type": "module", usaNodeNexttanto enmodulecomo enmoduleResolution. - Usar
tsccomo bundler. Es un compilador y comprobador de tipos. Usa Vite/esbuild/SWC para construir ytsc --noEmitpara comprobar tipos. - Compilarlo todo. Sin una lista
include, TypeScript recoge cada.tsque ve. La configuración generada escribe siempreinclude: ["src/**/*"]y excluyenode_modulesydist, así que estás cubierto. - Necesitar más de lo que ofrece la configuración. Este generador se mantiene mínimo a propósito. Opciones como
lib,paths,isolatedModulesonoEmitson fáciles de añadir a mano una vez colocado el archivo base.
Preguntas frecuentes
En monorepos y proyectos multipaquete, sí: un archivo base con las opciones comunes y cada paquete extendiéndolo con “extends”. Para un repositorio de un solo proyecto, un único tsconfig.json como el generado es más simple.
Se introdujo en TypeScript 5.0 para proyectos construidos con Vite, webpack o esbuild. Refleja cómo resuelven los imports los bundlers en la práctica, sin las reglas de extensiones de archivo del ESM de node16/nodenext. Para código que ejecuta Node directamente, prefiere node16 o nodenext.
No hay un control dedicado. Eso sí, el archivo generado fija siempre baseUrl en “.”, así que puedes pegar un bloque paths justo debajo, por ejemplo “@/*”: [“src/*”], y se resolverá desde la raíz del proyecto.
Normalmente no, y por eso este generador lo omite: target implica un conjunto de tipos de librería acorde. Sobrescribe lib a mano solo en casos especiales, como APIs del DOM en un proyecto Node o tipos de WebWorker.
No hace falta registrarse y no se guarda nada. Tus selecciones solo se usan para renderizar la vista previa de la configuración, y en la vista paso a paso viajan además en la URL de la página, lo que facilita guardar en marcadores o compartir una configuración terminada.
Herramientas relacionadas
Referencia de la tabla ASCII
Tabla ASCII completa del 0 al 127 con decimal, hex, octal, binario y referencia numérica HTML para cada carácter, incluidos los códigos de control como NUL, LF y DEL.
Generador de letras aleatorias
Genera letras aleatorias A-Z. Elige la cantidad, usa mayúsculas, minúsculas o mezcla de ambas, y aplica el resultado en juegos, consignas o clase.
Referencia de atajos de teclado
Busca los atajos predeterminados documentados de VS Code, Chrome y Bash con GNU Readline en macOS, Windows y Linux.
Referencia de caracteres HTML
Lista buscable de entidades HTML, sus códigos nombrados y numéricos, y una copia con un clic para caracteres y símbolos especiales.
Desofuscador de JavaScript
Desofusca JavaScript minificado o empaquetado con renombrado de variables, decodificación de arreglos de cadenas, reversión de aplanamiento de flujo de control y embellecimiento.
Convertidor de ASCII a Binario
Convierte cualquier cadena ASCII a su representación binaria. Cada carácter se convierte en ocho bits, separados por espacios, listos para pegar en un seguimiento de protocolo o tarea.
Herramienta disponible en otros idiomas
- เครื่องมือสร้างไฟล์ tsconfig.json [TH]
- مولد ملف tsconfig.json [AR]
- Tsconfig.json-generator [NL]
- tsconfig.json-generator [SV]
- Générateur de tsconfig.json [FR]
- Generator tsconfig.json [PL]
- tsconfig.json ジェネレーター [JA]
- Generator tsconfig.json [ID]
- Gerador de tsconfig.json [PT]
- tsconfig.json-Generator [DE]
- tsconfig.json 생성기 [KO]
- Bộ tạo tsconfig.json [VI]
- tsconfig.json Generator [EN]
- Generatore tsconfig.json [IT]
- Генератор tsconfig.json [RU]
- tsconfig.json Üretici [TR]
- tsconfig.json 生成器 [ZH]