Maison > outils de développement > VSCode > le corps du texte

Configuration de la compilation automatique TypeScript dans VSCode

青灯夜游
Libérer: 2021-11-02 09:31:29
avant
4348 Les gens l'ont consulté

Configuration de la compilation automatique TypeScript dans VSCode

Recommandations associées : "Tutoriel vscode"

Installer le compilateur TypeScript

Visual Studio Code inclut la prise en charge du langage TypeScript, mais Le compilateur TypeScript tsc n'est pas inclus. Vous devez installer le compilateur TypeScript globalement ou dans votre espace de travail pour convertir le code source TypeScript en JavaScript (tsc HelloWorld.ts).

Le moyen le plus simple d'installer TypeScript consiste à utiliser npm, le gestionnaire de packages Node.js, -g signifie installation globale.

Installer

npm install -g typescript
Copier après la connexion

Vérifiez la version - si l'installation réussit, les informations de version seront affichées

tsc --version
Copier après la connexion
xm@xm-Vostro-3670:~/project$ tsc --version
Version 3.3.3333
Copier après la connexion

Créez un nouveau dossier HelloWorld et un hello_world.ts fichier

mkdir HelloWorld
Copier après la connexion
const text:string = 'hello world';
console.log(text);
Copier après la connexion

Configuration de la compilation automatique TypeScript dans VSCode

Nouveau Tsconfig.json

{
  "compilerOptions": {
      "target": "es5",
      "module": "commonjs",
      "outDir": "out",
      "sourceMap": true
  }
}
Copier après la connexion

Ajouter une tâche

Tenimal->Exécuter une tâche

Configuration de la compilation automatique TypeScript dans VSCode

Sélectionneztsc:build-tsconfig.json

Configuration de la compilation automatique TypeScript dans VSCode

Configuration terminée

Appuyez sur F5

et constatez qu'il y a un extra out dossier dans le répertoire. La configuration est "outDir": "out",DEBUG CONSOLEoutputhello world.

Configuration de la compilation automatique TypeScript dans VSCode

ModifiertextEnregistrer et appuyer sur F5

Configuration de la compilation automatique TypeScript dans VSCode

Pour plus de connaissances sur la programmation, veuillez visiter : Vidéo de programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:juejin.im
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal