TypeScript er et supersett av JavaScript utviklet for å bygge tryggere applikasjoner i stor skala. Den legger til valgfri statisk skriving til språket, noe som gjør det lettere å oppdage feil før kompilering.

Språket introduserer også noen funksjoner som ikke finnes i JavaScript. Disse inkluderer generikk, klasser, grensesnitt, oppsummeringer og dekoratører.

Lær hvordan du setter opp ditt første TypeScript-prosjekt fra bunnen av med bare noen få trinn.

Trinn 1: Installere TypeScript

Før bruk TypeScript på systemet ditt, må du installere TypeScript-kompilatoren globalt.

Kjør følgende kommando for å installere TypeScript globalt:

npm installere -g maskinskrift

Trinn 2: Sette opp prosjektet ditt

For å sette opp TypeScript-prosjektet ditt, start med å lage en tom prosjektkatalog i hvilken som helst IDE etter eget valg.

Deretter oppretter du filene dine med .ts filutvidelse. TypeScript kan ikke kjøres i noe miljø. Derfor må den kompileres til JavaScript før den kan kjøres.

For å kompilere TypeScript-filene dine til JavaScript, naviger til prosjektkatalogen på terminalen. Så løp

instagram viewer
tsc etterfulgt av navnet på TypeScript-filen.

For eksempel:

tscindeks.ts

Denne kommandoen vil opprette en index.js fil i samme katalog din indeks.ts filen ligger.

Denne oppførselen kan være uønsket siden det ville gjøre prosjektet ditt vanskelig å administrere med flere .js og .ts filer i samme katalog.

Du endrer denne standardoppførselen og endrer oppførselen til TypeScript-kompilatoren ved å bruke tsconfig.json fil.

Kjør følgende kommando i terminalen for å lage en tsconfig.json fil i prosjektet ditt:

tsc --i det

Dette genererer en fil som inneholder alle konfigurasjonsinnstillingene for TypeScript-kompilatoren.

Du vil bare dekke det grunnleggende som trengs for å starte prosjektet ditt her, men du kan lære mer om det TypeScript tsconfig-dokumentasjonen.

Trinn 3: Sette opp TypeScript-kompilatoren for en bedre arbeidsflyt

De tsconfig.json filen inneholder konfigurasjonsalternativer for TypeScript-kompilatoren delt inn i syv seksjoner:

  • Prosjekter
  • Språk og miljø
  • Moduler
  • JavaScript-støtte
  • Send ut
  • Interop Begrensninger
  • Typekontroll
  • Fullstendighet

De fleste egenskapene er deaktivert som standard (de er kommentert ut). Du kan aktivere og endre dem ved å fjerne kommentarer.

Her er trinnene du må følge for å endre plasseringen til de genererte JavaScript-filene dine:

  1. Åpen tsconfig.json og finn avgir seksjon.
  2. I avgir seksjon, fjern kommentaren til utDir egenskap og spesifiser katalogen du vil lagre den kompilerte .ts filer. Nå når som helst du løper tsc, din .js filene vil være i den angitte mappen.

Løping tsc etterfulgt av navnet på filen du vil kompilere er ikke optimalt for arbeidsflyten din, spesielt når du trenger å kompilere flere filer.

For å løse dette problemet gir TypeScript-kompilatoren en egenskap som lar den kompilere alle filene i en katalog i én kommando.

Følg disse trinnene for å konfigurere dette:

  1. Åpen tsconfig.json og finn moduler seksjon.
  2. I moduler seksjon, fjern kommentaren til rootDir eiendom eller rootDirs (hvis du vil at kompilatoren skal kompilere flere .ts kataloger inn .js) og spesifiser filkatalogen(e).

Disse innstillingene vil gjøre arbeidsflyten din bedre og filene dine enklere å vedlikeholde.

Fordelene med TypeScript

Den største fordelen med TypeScript fremfor JavaScript er dens typesikkerhet. TypeScript gjør det mulig å oppdage feil som er vanskelig å finne raskt. Denne funksjonen gjør den ideell for å bygge sikre og store applikasjoner.