Referencias Tsconfig en TypeScript

Rana Hasnain Khan 21 junio 2023
Referencias Tsconfig en TypeScript

Introduciremos las referencias tsconfig en TypeScript.

las referencias tsconfig en TypeScript

El archivo tsconfig nos permite definir las diferentes partes de la aplicación como módulos independientes de TypeScript. Este archivo nos permite configurar cada módulo de manera diferente y construirlos de acuerdo a las necesidades de nuestra aplicación.

Hay algunos cambios principales introducidos en TypeScript 3.0. El archivo tsconfig.json se ha renombrado como tsconfig-base.json.

Esto hace que la carpeta raíz no se considere un proyecto de TypeScript porque TypeScript requiere que esté presente tsconfig.json para considerar el directorio como un proyecto de TypeScript.

La estructura del proyecto actual es como se muestra a continuación.

tsproject/
    src/
        entity.ts # exports an entity
        tsconfig.json
    test/
        entity.spec.ts # imports an entity
        tsconfig.json
    tsconfig-base.json

Como podemos ver en el ejemplo anterior, tanto src como test ahora contienen archivos tsconfig.json dentro de ellos; debido a esto, se considerarán proyectos separados. Pero si nos fijamos en el contenido de ambos archivos, son similares.

Al mismo tiempo, todas las configuraciones se almacenan en el archivo tsconfig-base.json, que luego es heredado por ambos archivos tsconfig.json.

Ahora, deberíamos preguntarnos cómo se vinculan las carpetas src y test para que las cosas funcionen y cómo se establece una relación entre estas carpetas. En la versión TypeScript 3.0, se hace referencia a ambas carpetas desde el exterior declarándolas como compuestas.

El contenido de los archivos de configuración src y test se muestra a continuación.

// src configuration in /src/tsconfig.json
{
    "extends": "../tsconfig-base.json",
    "compilerOptions": {
        // compiler options
        "composite": true
    }
}
// test configuration in /test/tsconfig.json
{
    "extends": "../tsconfig-base.json",
        "references": [
        { "path": "../src" }
    ]
}

Ahora, analicemos cómo podemos ejecutar pruebas. Antes de ejecutar las pruebas, debemos asegurarnos de haber construido el src.

Podemos construirlo fácilmente usando el siguiente comando en la consola, como se muestra a continuación.

tsc --build src
Rana Hasnain Khan avatar Rana Hasnain Khan avatar

Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.

LinkedIn