Bereitstellung einer TypeScript-Anwendung auf einem VPS: Schritt-für-Schritt-Anleitung

Online Python-Trainer für Anfänger

Lernen Sie Python einfach ohne theoretische Überlastung. Lösen Sie praktische Aufgaben mit automatischer Überprüfung und schreiben Sie Code direkt im Browser.

Kurs starten

Einleitung: Warum die Bereitstellung einer TypeScript-Anwendung auf einem VPS die richtige Wahl ist

Die Entwicklung in TypeScript hat sich dank strenger Typisierung und verbesserter Lesbarkeit des Codes zum Industriestandard entwickelt. Nach Abschluss der Entwicklung stellt sich jedoch eine entscheidende Frage: Wie stellt man die Anwendung ordnungsgemäß auf einem Produktionsserver bereit? Die Bereitstellung einer TypeScript-Anwendung auf einem VPS (Virtual Private Server) bedeutet nicht nur das Kopieren von Dateien. Es ist ein Prozess, der das Kompilieren von TypeScript in JavaScript, das Einrichten der Umgebung, die Verwaltung von Prozessen und die Gewährleistung der Sicherheit umfasst.

In diesem Artikel analysieren wir einen schrittweisen Algorithmus für die Bereitstellung einer TypeScript-Anwendung auf einem VPS. Sie erfahren, wie Sie den Server vorbereiten, den Build konfigurieren, die Anwendung mit dem PM2-Prozessmanager ausführen und sie über Nginx zugänglich machen. Das Material richtet sich an Entwickler, die bereits eine grundlegende TypeScript-Anwendung (z. B. Express.js oder NestJS) haben und diese auf einem Remote-Server bereitstellen möchten.



Schritt 1: Vorbereiten des VPS und Installieren der erforderlichen Software

Der erste Schritt bei der Bereitstellung einer TypeScript-Anwendung auf einem VPS ist die Einrichtung des Servers selbst. Wir verwenden Ubuntu 22.04 LTS als das stabilste und beliebteste Betriebssystem für Webserver.

Führen Sie nach der Verbindung zum Server per SSH die folgenden Befehle aus:

# Pakete aktualisierensudo apt update && sudo apt upgrade -y

# Node.js installieren (Version 18 oder höher)curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -sudo apt install -y nodejs

# Versionen prüfennode -vnpm -v

# Git installierensudo apt install git -y

# PM2-Prozessmanager installierennpm install -g pm2

Hinweis: TypeScript muss nicht global auf dem Server installiert werden. Es wird nur während der Build-Phase des Projekts verwendet, die entweder auf dem lokalen Rechner oder auf dem Server über CI/CD-Skripte durchgeführt werden kann.

Es wird außerdem empfohlen, eine grundlegende Firewall einzurichten:

sudo ufw allow OpenSSHsudo ufw allow 'Nginx Full'sudo ufw enable


Schritt 2: Klonen des Projekts und Erstellen von TypeScript

Nachdem der Server bereit ist, übertragen wir den Code der TypeScript-Anwendung. Die gängigste Methode ist das Klonen des Repositorys über Git.

# Repository klonengit clone https://github.com/your-username/your-project.gitcd your-project

# Abhängigkeiten installierennpm install

# TypeScript in JavaScript kompilierennpx tsc

Wichtig: Stellen Sie sicher, dass der Ausgabeordner in der Datei tsconfig.json korrekt angegeben ist. Normalerweise ist dies dist oder build:

{  "compilerOptions": {    "target": "ES2020",    "module": "commonjs",    "outDir": "./dist",    "rootDir": "./src",    "strict": true,    "esModuleInterop": true  },  "include": ["src/**/*"],  "exclude": ["node_modules", "dist"]}

Nach erfolgreicher Kompilierung erscheint im Ordner dist der ausführbare JavaScript-Code. Überprüfen Sie, ob die Anwendung korrekt startet:

node dist/index.js


Schritt 3: Ausführen über PM2 und Konfigurieren des automatischen Starts

Das einfache Starten über node ist für die Produktion nicht geeignet — wenn die SSH-Verbindung unterbrochen wird, stoppt der Prozess. Für die Bereitstellung einer TypeScript-Anwendung auf einem VPS verwenden wir PM2, das Folgendes bietet:

  • Automatischer Neustart nach einem Absturz
  • Protokollierung von Fehlern und stdout
  • Clustering (Ausführung auf mehreren CPU-Kernen)

Erstellen Sie eine Datei ecosystem.config.js im Projektstammverzeichnis:

module.exports = {  apps: [{    name: 'my-ts-app',    script: './dist/index.js',    instances: 'max',    exec_mode: 'cluster',    env: {      NODE_ENV: 'production',      PORT: 3000    },    error_file: './logs/err.log',    out_file: './logs/out.log',    merge_logs: true  }]};

Starten Sie die Anwendung über PM2:

pm2 start ecosystem.config.jspm2 save

Blogs

Buchempfehlungen