A la découverte de TypeScript–Vos premiers pas - Dev to be curious

Hey, nous allons continuer à découvrir Angular, je vous rassure. Avant ça, nous allons nous arrêter sur le compilateur utilisé par Angular : TypeScript.

Installation de Typescript

Vous devez avoir node.js installé sur votre pc.

Puis vous pourrez lancer la commande :
npm install -g typescript

Hey attendez avant d’installer : si vous êtes déjà sous Visual Studio 2017 : c’est déjà inclus ! Elle est pas belle la vie

Dans votre site web, côté Startup.cs, vous devez par contre avoir le middleware app.StaticFiles() d’installé.

Trois règles importantes à suivre pour que tout fonctionne, avec VIsual Studio (Community, Pro)

1. Vous devez créer un dossier scripts, à la racine de votre projet : il va réceptionner vos fichier TypeScript (extension .ts)
2. Vous devez configurer un fichier tsconfig.json à déposer dans le dossier scripts : il sera la configuration du moteur TypeScript
3. Vous devez préciser dans ce fichier le dossier de génération : “outDir”: “../wwwroot/js”

Des points importants à expliquer sur ce fichier tsconfig.json

Ici, on découvre qu’il va générer du javascript à la norme ES6.

Nous pouvons noter qu’il ne générera notre fichier javascript que lorsque le compilateur TypeScript pourra compiler sans erreurs.

Certains dossiers sont exclus pour détecter les fichiers ts (TypeScript), ici : wwwroot, et node_modules.

Lancer l’application et découvrir la création automatique des fichiers TypeScript en Javascript

Vous avez lancé votre application après ce paramétrage, depuis Visual Studio ? C’est dingue non ! Tout fonctionne sans avoir à lancer une autre commande.

Ca ça fonctionne uniquement si nous utilisons Visual Studio Community (ou Pro).

Si vous utilisez Visual Code, vous devrez ajouter une dll dédiée : Microsoft.TypeScript.MSBuild : cela vous permettra de lancer la commande :

dotnet build et lancer la génération des fichiers javascript.

Or nous rencontrons alors un soucis de compatibilité de la dll avec la version de TypeScript.

Nous devons utiliser la bonne version de la librairie Microsoft.TypeScript.MSBuild.

Pour connaitre la version actuellement installée :

Nous devons donc installer la version 2.8.1 ou 2.8.3 de la librairie pour que cela fonctionne.

Or, avec la 2.8.1, ça ne fonctionne toujours pas : nous utiliserons donc la version 2.8.3 !

Un dernier point pour exécuter la génération des fichiers js, est d’appeler directement l’exécutable tsc.exe.

Il est présent dans le dossier :

C:\Program Files (x86)\Microsoft SDKs\TypeScript\(version)

Prochaine aventure : découvrir les spécificités de TypeScript !