Primero tenemos que tener instalado nodejs ya que al instalarlo se instala el npm.
Lo podemos instalar desde su página oficial nodejs.org.
Podemos confirmar que estan instalados abriendo una ventana de comandos y escribir
node -v
npm -v
de lo contrario revisar las variables de entorno o instalar.
Instalamos Typescript desde su página oficial typescriplang.org/download .
En dicha página vienen las instrucciones que tipearemos en el npm.
npm install typescript --save-dev
Esto nos permitira compilar nuestras apps con tsc o npx tsc.
Abrirmos nuestro proyecto en visual code.
Haremos un archivo que contendrá información del proyecto llamado package.json, lo hacemos escribiendo desde la terminal de visual code
npm init
podemos hacerlo desde una terminal externa pero debemos estar ubicados en la carpeta del proyecto .
Damos enter a todo a menos que configuremos cosas como el nombre del proyecto. Después escribimos yes cuando nos lo pida.
Ahora necesitamos un servidor de pruebas. Desde la terminal de visual code escribimos
npm install http-server --save-dev
Ahora que tenemos el servidor de pruebas, abrimos el archivo package.json y donde dice "scripts"
borramos lo que tiene y escribimos
"start" : "http-server -p 8765"
En seguida vamos a crear el archivo de configuración de typescript, para eso desde la terminal de visual code en nuestro proyecto escribimos
npx tsc --init
Esto nos ha creado un archivo llamado tsconfig.json
Abrimos el archivo tsconfig.json y comentamos la linea
"module" : "common.js"
También añadimos
,
"files" : [
"./app/index.ts"
]
en la parte final antes del }
También descomentamos la linea del "outDir" y la dejamos así
"outDir": "./js/index.js",
Creamos la carpeta "app" desde visual code, ahí estarán los archivos .ts
Creamos la carpeta "js" donde estarn los archivos .js que genere typescript
En nuestro index.html ponemos la etiqueta
<script src = "./js/index.js"></script>
antes de la etiqueta </body>
Ahora podemos crear código de typescript y lo compilamos con npx tsc
Levantamos el servidor desde la terminal con
npm start
abrimos el navegador y escribimos
localhost:8765
Podemos visualizar ahora nuestra app web.