Inhaltsverzeichnis
Installieren Sie den TypeScript-Compiler
安装
检查版本-安装成功会输出版本信息
新建HelloWorld文件夹和hello_world.ts文件
新建Tsconfig.json
新增任务
Tenimal->Run Task
配置完成
Installieren " >修改text保存按下F5

Installieren

Überprüfen Sie die Version – wenn die Installation erfolgreich ist, die Version Informationen werden ausgegeben
rrreee

Neue Aufgabe" >Neue Tsconfig.jsonrrreee

Neue Aufgabe

Heim Entwicklungswerkzeuge VSCode Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

Feb 12, 2021 am 09:25 AM
vscode

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

Verwandte Empfehlungen: „vscode-Tutorial

Installieren Sie den TypeScript-Compiler

Visual Studio Code umfasst TypeScript-Sprachunterstützung, jedoch nicht den TypeScript-Compiler tsc. Sie müssen den TypeScript-Compiler global oder in Ihrem Arbeitsbereich installieren, um TypeScript-Quellcode in JavaScript (tsc HelloWorld.ts) zu konvertieren.

Der einfachste Weg, TypeScript zu installieren, ist über npm, den Node.js-Paketmanager. -g bedeutet globale Installation. -g表示全局安装。

安装

npm install -g typescript
Nach dem Login kopieren

检查版本-安装成功会输出版本信息

tsc --version
Nach dem Login kopieren
xm@xm-Vostro-3670:~/project$ tsc --version
Version 3.3.3333
Nach dem Login kopieren

新建HelloWorld文件夹和hello_world.ts文件

mkdir HelloWorld
Nach dem Login kopieren
const text:string = 'hello world';
console.log(text);
Nach dem Login kopieren

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

新建Tsconfig.json

{
  "compilerOptions": {
      "target": "es5",
      "module": "commonjs",
      "outDir": "out",
      "sourceMap": true
  }
}
Nach dem Login kopieren

新增任务

Tenimal->Run Task

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

选择tsc:build-tsconfig.json

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

配置完成

按下F5

发现目录下多了一个out文件夹配置的是"outDir": "out",DEBUG CONSOLE输出hello world

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

修改text保存按下F5

Installieren

rrreee

Überprüfen Sie die Version – wenn die Installation erfolgreich ist, die Version Informationen werden ausgegeben

rrreeerrreeeErstellen Sie einen neuen Ordner HelloWorld und eine neue Datei hello_world.tsKonfigurieren der automatischen TypeScript-Kompilierung in VSCoderrreeerrreee

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode

Neue Tsconfig.jsonrrreee

Neue Aufgabe

Tenimal ->Aufgabe ausführen🎜Konfigurieren der automatischen TypeScript-Kompilierung in VSCode🎜

Wählen Sie tsc:build-tsconfig.json🎜🎜Konfigurieren der automatischen TypeScript-Kompilierung in VSCode🎜

Konfiguration abgeschlossen🎜

Drücken Sie F5🎜🎜 und stellen Sie fest, dass es einen zusätzlichen out Ordnerkonfiguration im Verzeichnis ist "outDir": "out", DEBUG CONSOLE gibt hello world aus. 🎜

Konfigurieren der automatischen TypeScript-Kompilierung in VSCode🎜

Ändern Sie text zum Speichern und drücken Sie F5 Code >🎜🎜🎜🎜🎜Weitere Programmierkenntnisse finden Sie unter: 🎜Programmiervideo🎜! ! 🎜

Das obige ist der detaillierte Inhalt vonKonfigurieren der automatischen TypeScript-Kompilierung in VSCode. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Welche Computerkonfiguration ist für VSCODE erforderlich? Welche Computerkonfiguration ist für VSCODE erforderlich? Apr 15, 2025 pm 09:48 PM

VS Code system requirements: Operating system: Windows 10 and above, macOS 10.12 and above, Linux distribution processor: minimum 1.6 GHz, recommended 2.0 GHz and above memory: minimum 512 MB, recommended 4 GB and above storage space: minimum 250 MB, recommended 1 GB and above other requirements: stable network connection, Xorg/Wayland (Linux)

So definieren Sie Header -Dateien für VSCODE So definieren Sie Header -Dateien für VSCODE Apr 15, 2025 pm 09:09 PM

Wie definiere ich Header -Dateien mithilfe von Visual Studio -Code? Erstellen Sie eine Header -Datei und deklarieren Sie Symbole in der Header -Datei mit dem Namen .h oder .HPP -Suffix (wie Klassen, Funktionen, Variablen) das Programm mit der #include -Direktive kompilieren, um die Header -Datei in die Quelldatei aufzunehmen. Die Header -Datei wird enthalten und die deklarierten Symbole sind verfügbar.

So lösen Sie das Problem der VSCODE -chinesischen Annotationen, die Fragen zu Fragen werden So lösen Sie das Problem der VSCODE -chinesischen Annotationen, die Fragen zu Fragen werden Apr 15, 2025 pm 11:36 PM

So lösen Sie das Problem, dass chinesische Kommentare im Visual Studio-Code zu Fragenzeichen werden: Überprüfen Sie die Dateikodierung und stellen Sie sicher, dass es sich um "UTF-8 ohne Bom" handelt. Ändern Sie die Schriftart in eine Schriftart, die chinesische Charaktere wie "Song Style" oder "Microsoft Yahei" unterstützt. Installieren Sie die Schriftart neu. Aktivieren Sie die Unterstützung von Unicode. Aktualisieren Sie VSCODE, starten Sie den Computer neu und erstellen Sie die Quelldatei neu.

So verwenden Sie VSCODE So verwenden Sie VSCODE Apr 15, 2025 pm 11:21 PM

Visual Studio Code (VSCODE) ist ein plattformübergreifender, Open-Source-Editor und kostenloser Code-Editor, der von Microsoft entwickelt wurde. Es ist bekannt für seine leichte, Skalierbarkeit und Unterstützung für eine Vielzahl von Programmiersprachen. Um VSCODE zu installieren, besuchen Sie bitte die offizielle Website, um das Installateur herunterzuladen und auszuführen. Bei der Verwendung von VSCODE können Sie neue Projekte erstellen, Code bearbeiten, Code bearbeiten, Projekte navigieren, VSCODE erweitern und Einstellungen verwalten. VSCODE ist für Windows, MacOS und Linux verfügbar, unterstützt mehrere Programmiersprachen und bietet verschiedene Erweiterungen über den Marktplatz. Zu den Vorteilen zählen leicht, Skalierbarkeit, umfangreiche Sprachunterstützung, umfangreiche Funktionen und Versionen

Gemeinsame Befehle für VSCODE Terminal Gemeinsame Befehle für VSCODE Terminal Apr 15, 2025 pm 10:06 PM

Common commands for VS Code terminals include: Clear the terminal screen (clear), list the current directory file (ls), change the current working directory (cd), print the current working directory path (pwd), create a new directory (mkdir), delete empty directory (rmdir), create a new file (touch) delete a file or directory (rm), copy a file or directory (cp), move or rename a file or directory (MV) Dateiinhalt anzeigen (CAT) Dateiinhalt anzeigen und scrollen (weniger) Dateiinhalt anzeigen Inhalt nur Scrollen Sie nach unten (mehr) Zeigen Sie die ersten Zeilen der Datei an (Kopf).

VSCODE Vorheriger nächster Verknüpfungsschlüssel VSCODE Vorheriger nächster Verknüpfungsschlüssel Apr 15, 2025 pm 10:51 PM

VS Code One-Step/Nächster Schritt Verknüpfungsschlüsselnutzung: Einschritt (rückwärts): Windows/Linux: Strg ←; macOS: CMD ← Nächster Schritt (vorwärts): Windows/Linux: Strg →; macos: cmd →

So wechseln Sie den chinesischen Modus mit VSCODE So wechseln Sie den chinesischen Modus mit VSCODE Apr 15, 2025 pm 11:39 PM

VS-Code zum chinesischen Modus wechseln: Öffnen Sie die Einstellungsschnittstelle (Windows/Linux: Strg, MacOS: CMD,) Suchen

So setzen Sie VSCODE auf Chinesisch So setzen Sie VSCODE auf Chinesisch Apr 15, 2025 pm 09:27 PM

Es gibt zwei Möglichkeiten, eine chinesische Sprache im Visual Studio -Code einzurichten: 1. Installieren Sie das chinesische Sprachpaket; 2. Ändern Sie die Einstellungen "Gebietsschema" in der Konfigurationsdatei. Stellen Sie sicher, dass die Visual Studio -Code -Version 1.17 oder höher ist.

See all articles