Configurar Proyecto en TypeScript

1.Instalar Node.js y npm

Primero, asegúrate de tener Node.js y npm (Node Package Manager) instalados en tu máquina. Puedes descargar Node.js desde su sitio web oficial.

2.Crear una Carpeta para tu Proyecto

Crea una nueva carpeta para tu proyecto y navega a ella en tu terminal.

mkdir my-typescript-project
cd my-typescript-project

3.Inicializar un Proyecto de npm

Inicializa un nuevo proyecto de npm en la carpeta de tu proyecto. Esto creará un archivo package.json.

npm init -y

4.Instalar TypeScript

Instala TypeScript como una dependencia de desarrollo en tu proyecto.

npm install typescript --save-dev

5.Crear el Archivo de Configuración de TypeScript

Crea un archivo tsconfig.json en la raíz de tu proyecto. Este archivo define la configuración del compilador de TypeScript.

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "outDir": "./dist"
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

6.Crear la Carpeta de Código Fuente

Crea una carpeta src en la raíz de tu proyecto. Aquí es donde colocarás tus archivos TypeScript.

mkdir src

7: Crear un Archivo TypeScript

Crea un archivo index.ts en la carpeta src con un ejemplo básico de código TypeScript.

// src/index.ts
function greeter(person: string) {
  return `Hello, ${person}!`;
}

let user = "World";

console.log(greeter(user));

8.Compilar el Código TypeScript

Para compilar tu código TypeScript, ejecuta el siguiente comando en tu terminal:

npx tsc

Esto compilará el código TypeScript y generará los archivos JavaScript en la carpeta dist.

9.Ejecutar el Código Compilado

Para ejecutar el código compilado, utiliza Node.js:

node dist/index.js

10.Automatizar el Proceso con npm Scripts

Para hacer más fácil la compilación y ejecución, puedes agregar scripts en tu package.json.

{
  "name": "my-typescript-project",
  "version": "1.0.0",
  "description": "",
  "main": "dist/index.js",
  "scripts": {
    "build": "tsc",
    "start": "node dist/index.js",
    "dev": "tsc --watch"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "typescript": "^4.0.0"
  }
}

Explicación de los Scripts

• "build": Compila el código TypeScript.
• "start": Ejecuta el archivo JavaScript compilado.
• "dev": Compila el código TypeScript en modo watch, recompilando automáticamente cuando los archivos cambian.

Resumen de la Estructura del Proyecto

La estructura final de tu proyecto debería verse así:

my-typescript-project/
├── node_modules/
├── src/
│   └── index.ts
├── dist/
│   └── index.js
├── package.json
└── tsconfig.json