TypeScript - Configuration de l'environnement
Essayez-le Option en ligne
Nous avons déjà mis en place la programmation TypeScript en ligne, afin que vous puissiez exécuter tous les exemples disponibles en ligne en même temps lorsque vous effectuez votre travail théorique. Cela vous donne confiance dans ce que vous lisez et pour vérifier le résultat avec différentes options. N'hésitez pas à modifier n'importe quel exemple et à l'exécuter en ligne.
Essayez l'exemple suivant en utilisant notre option de compilateur en ligne disponible sur CodingGround
var message:string = "Hello World"
console.log(message)Lors de la compilation, il générera le code JavaScript suivant.
//Generated by typescript 1.8.10
var message = "Hello World";
console.log(message);Pour la plupart des exemples donnés dans ce tutoriel, vous trouverez un Try itoption dans nos sections de code de site Web dans le coin supérieur droit, qui vous mènera au compilateur en ligne. Alors profitez-en et profitez de votre apprentissage.
Dans ce chapitre, nous verrons comment installer TypeScript sur la plate-forme Windows. Nous expliquerons également comment installer l'EDI Brackets.
TypeScript ─ Option d'essai en ligne
Vous pouvez tester vos scripts en ligne en utilisant The TypeScript à l' adresse www.typescriptlang.org/Playground . L'éditeur en ligne affiche le JavaScript correspondant émis par le compilateur.
Vous pouvez essayer l'exemple suivant en utilisant Playground.
var num:number = 12
console.log(num)Lors de la compilation, il générera le code JavaScript suivant.
//Generated by typescript 1.8.10
var num = 12;
console.log(num);La sortie du programme ci-dessus est donnée ci-dessous -
12Configuration de l'environnement local
Typescript est une technologie Open Source. Il peut fonctionner sur n'importe quel navigateur, n'importe quel hôte et n'importe quel système d'exploitation. Vous aurez besoin des outils suivants pour écrire et tester un programme Typescript -
Un éditeur de texte
L'éditeur de texte vous aide à écrire votre code source. Quelques exemples d'éditeurs incluent le Bloc-notes Windows, Notepad ++, Emacs, vim ou vi, etc. Les éditeurs utilisés peuvent varier selon les systèmes d'exploitation.
Les fichiers source sont généralement nommés avec l'extension .ts
Le compilateur TypeScript
Le compilateur TypeScript est lui-même un .tsfichier compilé en fichier JavaScript (.js). Le TSC (TypeScript Compiler) est un compilateur source à source (transcompilateur / transpilateur).
Le TSC génère une version JavaScript du .tsfichier qui lui a été transmis. En d'autres termes, le TSC produit un code source JavaScript équivalent à partir du fichier Typescript qui lui est donné en entrée. Ce processus est appelé transpilation.
Cependant, le compilateur rejette tout fichier JavaScript brut qui lui est passé. Le compilateur ne traite que.ts ou .d.ts des dossiers.
Installation de Node.js
Node.js est un environnement d'exécution multiplateforme open source pour JavaScript côté serveur. Node.js est requis pour exécuter JavaScript sans prise en charge du navigateur. Il utilise le moteur JavaScript de Google V8 pour exécuter du code. Vous pouvez télécharger le code source de Node.js ou un programme d'installation prédéfini pour votre plate-forme. Node est disponible ici -https://nodejs.org/en/download
Installation sous Windows
Suivez les étapes ci-dessous pour installer Node.js dans l'environnement Windows.
Step 1 - Téléchargez et exécutez le programme d'installation .msi pour Node.
Step 2 - Pour vérifier si l'installation a réussi, entrez la commande node –v dans la fenêtre du terminal.
Step 3 - Tapez la commande suivante dans la fenêtre du terminal pour installer TypeScript.
npm install -g typescript
Installation sous Mac OS X
Pour installer node.js sur Mac OS X, vous pouvez télécharger un package binaire pré-compilé qui permet une installation agréable et facile. Dirigez-vous vershttp://nodejs.org/ et cliquez sur le bouton Installer pour télécharger le dernier package.
Installez le package à partir du .dmg en suivant l'assistant d'installation qui installera à la fois le nœud et npm. npm est Node Package Manager qui facilite l'installation de packages supplémentaires pour node.js.
Installation sous Linux
Vous devez installer un certain nombre de dépendances avant de pouvoir installer Node.js et NPM.
Ruby et GCC. Vous aurez besoin de Ruby 1.8.6 ou plus récent et de GCC 4.2 ou plus récent.
Homebrew. Homebrew est un gestionnaire de paquets conçu à l'origine pour Mac, mais il a été porté sous Linux en tant que Linuxbrew. Vous pouvez en savoir plus sur Homebrew surhttp://brew.sh/ et Linuxbrew sur http://brew.sh/linuxbrew
Une fois ces dépendances installées, vous pouvez installer Node.js en utilisant la commande suivante sur le terminal -
brew install node.Prise en charge IDE
Typescript peut être construit sur une pléthore d'environnements de développement comme Visual Studio, Sublime Text 2, WebStorm / PHPStorm, Eclipse, Brackets, etc. Les IDE Visual Studio Code et Brackets sont discutés ici. L'environnement de développement utilisé ici est Visual Studio Code (plateforme Windows).
Code Visual Studio
Il s'agit d'un IDE open source de Visual Studio. Il est disponible pour les plates-formes Mac OS X, Linux et Windows. VScode est disponible sur -https://code.visualstudio.com/
Installation sous Windows
Step 1- Téléchargez Visual Studio Code pour Windows.
Step 2- Double-cliquez sur VSCodeSetup.exe
Step 3 - Une capture d'écran de l'IDE est donnée ci-dessous.
Step 4- Vous pouvez directement accéder au chemin du fichier en faisant un clic droit sur le fichier → ouvrir dans l'invite de commande. De même, l'option Révéler dans l'Explorateur affiche le fichier dans l'Explorateur de fichiers.
Installation sous Mac OS X
Le guide d'installation spécifique à Mac OS X de Visual Studio Code est disponible à l'adresse
https://code.visualstudio.com/Docs/editor/setup
Installation sous Linux
Le guide d'installation spécifique à Linux pour Visual Studio Code est disponible à l'adresse
https://code.visualstudio.com/Docs/editor/setup
Supports
Brackets est un éditeur open-source gratuit pour le développement Web, créé par Adobe Systems. Il est disponible pour Linux, Windows et Mac OS X. Les supports sont disponibles surhttp://brackets.io/
Extensions TypeScript pour parenthèses
Brackets prend en charge les extensions pour ajouter des fonctionnalités supplémentaires via le gestionnaire d'extensions. Les étapes suivantes expliquent l'installation des extensions TypeScript en utilisant les mêmes.
Après l'installation, cliquez sur l'icône du gestionnaire d'extensions
à droite de l'éditeur. Entrez dactylographié dans la zone de recherche.
Installez les plug-ins Brackets TSLint et Brackets TypeScript.
Vous pouvez exécuter l'invite / shell DOS dans Brackets lui-même en ajoutant une autre extension Brackets Shell.
Lors de l'installation, vous trouverez une icône de shell sur le côté droit de l'éditeur
Note- Typescript est également disponible en tant que plugin pour les environnements Visual Studio 2012 et 2013 (https://www.typescriptlang.org/#Download).VS 2015 et versions ultérieures inclut le plugin Typescript par défaut.
Maintenant, vous êtes prêt !!!