TypeScript är en superset av JavaScript som utvecklats för att bygga säkrare, storskaliga applikationer. Den lägger till valfri statisk skrivning till språket, vilket gör det lättare att upptäcka fel före kompilering.

Språket introducerar också vissa funktioner som inte finns i JavaScript. Dessa inkluderar generika, klasser, gränssnitt, uppräkningar och dekoratörer.

Lär dig hur du ställer in ditt första TypeScript-projekt från början med bara några få steg.

Steg 1: Installera TypeScript

Innan användning TypeScript på ditt system måste du installera TypeScript-kompilatorn globalt.

Kör följande kommando för att installera TypeScript globalt:

npm Installera -g maskinskriven

Steg 2: Konfigurera ditt projekt

För att ställa in ditt TypeScript-projekt, börja med att skapa en tom projektkatalog i valfri IDE du väljer.

Skapa sedan dina filer med .ts filtillägget. TypeScript kan inte köras i någon miljö. Därför måste den kompileras till JavaScript innan den kan köras.

För att kompilera dina TypeScript-filer till JavaScript, navigera till din projektkatalog på din terminal. Spring sedan

instagram viewer
tsc följt av namnet på din TypeScript-fil.

Till exempel:

tscindex.ts

Detta kommando kommer att skapa en index.js fil i samma katalog din index.ts filen finns.

Detta beteende kan vara oönskat eftersom det skulle göra ditt projekt svårt att hantera med flera .js och .ts filer i samma katalog.

Du ändrar detta standardbeteende och modifierar beteendet för din TypeScript-kompilator med hjälp av tsconfig.json fil.

Kör följande kommando i din terminal för att skapa en tsconfig.json fil i ditt projekt:

tsc --i det

Detta genererar en fil som innehåller alla konfigurationsinställningar för din TypeScript-kompilator.

Du kommer bara att täcka grunderna som behövs för att starta ditt projekt här, men du kan lära dig mer om det TypeScript tsconfig-dokumentationen.

Steg 3: Konfigurera TypeScript-kompilatorn för ett bättre arbetsflöde

De tsconfig.json filen innehåller konfigurationsalternativ för TypeScript-kompilatorn uppdelad i sju sektioner:

  • Projekt
  • Språk och miljö
  • Moduler
  • JavaScript-stöd
  • Avge
  • Interop-begränsningar
  • Typkontroll
  • Fullständighet

De flesta av egenskaperna är inaktiverade som standard (de kommenteras bort). Du kan aktivera och ändra dem genom att avkommentera dem.

Här är stegen du måste följa för att ändra platsen för dina genererade JavaScript-filer:

  1. Öppna tsconfig.json och lokalisera avge sektion.
  2. I den avge avsnitt, av-kommentera utDir egenskap och ange den katalog du vill lagra den kompilerade .ts filer. Nu när du springer tsc, din .js filerna kommer att finnas i den angivna mappen.

Löpning tsc följt av namnet på filen du vill kompilera är inte optimalt för ditt arbetsflöde, speciellt när du behöver kompilera flera filer.

För att lösa detta problem tillhandahåller TypeScript-kompilatorn en egenskap som gör att den kan kompilera alla filer i en katalog i ett kommando.

Följ dessa steg för att ställa in detta:

  1. Öppna tsconfig.json och lokalisera moduler sektion.
  2. I den moduler avsnitt, av-kommentera rootDir egendom eller rootDirs (om du vill att kompilatorn ska kompilera flera .ts kataloger in .js) och ange filkatalog(er).

Dessa inställningar kommer att göra ditt arbetsflöde bättre och dina filer lättare att underhålla.

Fördelarna med TypeScript

Den stora fördelen med TypeScript framför JavaScript är dess typsäkerhet. TypeScript gör det möjligt att snabbt upptäcka svåra att hitta buggar. Denna funktion gör den idealisk för att bygga säkra och storskaliga applikationer.