Mostramos las herramientas necesarias para poder desarrollar aplicaciones TypeScript con el IDE Visual Studio Code. Realizamos nuestra primera aplicación TypeScript «Hola mundo».
- Instalar de Node.js y npm en Windows y Linux.
- Instalar el compilador TypeScript en Windows y Linux.
- Primer proyecto Hola Mundo en TypeScript con Visual Studio Code.
Instalar de Node.js y npm en Windows y Linux
En primer lugar, instalaremos Node.js y npm, tal y como explicamos en el siguiente enlace:
Instalar el compilador TypeScript en Windows y Linux
El IDE de desarrollo Visual Studio Code admite TypeScript como lenguaje de programación, pero no incluye un compilador. A continuación indicamos cómo instalar el compilador de TypeScript en Windows y Linux.
Una vez instalado npm, lo usaremos para instalar TypeScript. Para ello, desde una ventana de comandos (Símbolo de sistema o cmd), ejecutaremos el siguiente comando (instalará TypeScript a nivel global, para todo el equipo):
|
1 |
npm install -g typescript |
En caso de querer instalar TypeScript únicamente para un proyecto, desde su carpeta, ejecutaremos el comando:
|
1 |
npm install --save-dev typescript |
Para el caso de Linux, el comando es el mismo, añadiendo «sudo» si es necesario:
|
1 |
sudp npm install -g typescript |
Una vez instalado el compilador de TypeScript, podremos ver que, efectivamente, está correctamente instalado ejecutando el comando:
|
1 |
tsc --version |
Nos debe devolver la versión, tanto en Windows:
Como en Linux:
Primer proyecto Hola Mundo en TypeScript con Visual Studio Code
Abriremos Visual Studio Code y trabaremos con un Workspace (una carpeta de trabajo). En dicha carpeta crearemos otra para alojar los ficheros de nuestro proyecto Hola mundo. Y en esta carpeta, crearemos un fichero llamado holamundo.js:
Al colocarle la extensión .js, Visual Studio Code lo tratará como código TypeScript. Introduciremos las siguientes líneas de código TypeScript al fichero:
|
1 2 |
let mensaje: string = "Hola mundo. Primer proyecto TypeScript por ProyectoA"; console.log(mensaje); |
Para compilarlo, abriremos una ventana de terminal desde el propio Visual Studio Code, nos posicionaremos en la carpeta del proyecto, con:
|
1 |
cd .\TypeScript\HolaMundo\ |
Lo compilaremos con:
|
1 |
tsc .\holamundo.ts |
Esto generará un fichero con extensión .js (holamundo.js), para ejecutarlo, usaremos el comando:
|
1 |
node .\holamundo.js |
Que ejecutará el .js y mostrará por consola el mensaje «Hola mundo. Primer proyecto TypeScript por ProyectoA»:
