TypeScript is een superset van JavaScript die is ontwikkeld voor het bouwen van veiligere, grootschalige toepassingen. Het voegt optioneel statisch typen toe aan de taal, waardoor het gemakkelijker wordt om fouten te detecteren voordat het wordt gecompileerd.
De taal introduceert ook enkele functies die niet in JavaScript bestaan. Deze omvatten generieke geneesmiddelen, klassen, interfaces, opsommingen en decorateurs.
Leer in slechts enkele stappen hoe u uw eerste TypeScript-project helemaal opnieuw kunt opzetten.
Stap 1: TypeScript installeren
Voor gebruik TypeScript op uw systeem, moet u de TypeScript-compiler globaal installeren.
Voer de volgende opdracht uit om TypeScript globaal te installeren:
npm installeren -g typoscript
Stap 2: Uw project opzetten
Om uw TypeScript-project in te stellen, begint u met het maken van een lege projectdirectory in elke IDE naar keuze.
Maak vervolgens uw bestanden met de .ts bestandsextensie. TypeScript kan in geen enkele omgeving worden uitgevoerd. Het moet dus in JavaScript worden gecompileerd voordat het kan worden uitgevoerd.
Om uw TypeScript-bestanden in JavaScript te compileren, navigeert u naar uw projectdirectory op uw terminal. Ren dan tsc gevolgd door de naam van uw TypeScript-bestand.
Bijvoorbeeld:
tscinhoudsopgave.ts
Dit commando zal een index.js bestand in dezelfde map uw index.ts bestand verblijft.
Dit gedrag kan ongewenst zijn, omdat het uw project moeilijk te beheren zou maken met meerdere .js en .ts bestanden in dezelfde map.
U wijzigt dit standaardgedrag en wijzigt het gedrag van uw TypeScript-compiler met behulp van de tsconfig.json het dossier.
Voer de volgende opdracht in uw terminal uit om een tsconfig.json bestand in uw project:
tsc --in het
Dit genereert een bestand met alle configuratie-instellingen voor uw TypeScript-compiler.
Je behandelt hier alleen de basis die nodig is om je project te starten, maar je kunt er meer over leren de TypeScript tsconfig-documentatie.
Stap 3: De TypeScript-compiler instellen voor een betere workflow
De tsconfig.json bestand bevat configuratie-opties voor de TypeScript-compiler, verdeeld in zeven secties:
- Projecten
- Taal en omgeving
- Modules
- JavaScript-ondersteuning
- Uitzenden
- Interoperabiliteitsbeperkingen
- Typecontrole
- Volledigheid
De meeste eigenschappen zijn standaard uitgeschakeld (ze zijn uitgecommentarieerd). U kunt ze activeren en wijzigen door ze te verwijderen.
Dit zijn de stappen die u moet volgen om de locatie van uw gegenereerde JavaScript-bestanden te wijzigen:
- Open tsconfig.json en zoek de uitstoten sectie.
- In de uitstoten sectie, verwijder commentaar op de uitDir eigenschap en specificeer de map waarin u de gecompileerde. wilt opslaan .ts bestanden. Nu wanneer je rent tsc, uw .js bestanden bevinden zich in de opgegeven map.
Rennen tsc gevolgd door de naam van het bestand dat u wilt compileren, is niet optimaal voor uw workflow, vooral wanneer u meerdere bestanden moet compileren.
Om dit probleem op te lossen, biedt de TypeScript-compiler een eigenschap waarmee alle bestanden in een map in één opdracht kunnen worden gecompileerd.
Volg deze stappen om dit in te stellen:
- Open tsconfig.json en zoek de modules sectie.
- In de modules sectie, verwijder commentaar op de rootDir eigendom of rootDirs (als u wilt dat de compiler meerdere compileert) .ts mappen naar .js) en specificeer de bestandsdirectory(s).
Deze instellingen maken uw workflow beter en uw bestanden gemakkelijker te onderhouden.
De voordelen van TypeScript
Het grote voordeel van TypeScript ten opzichte van JavaScript is de typeveiligheid. TypeScript maakt het mogelijk om moeilijk te vinden bugs snel te detecteren. Deze functie maakt het ideaal voor het bouwen van veilige en grootschalige toepassingen.
