It’s #FrontendFriday – npm oder npx – was ist eig. der Unterschied?

npm vs. npx – Wann solltest du was benutzen?

Hallo #FrontendFriday-Leser/in,

heute widmen wir uns einem Thema, das im Alltag eines JavaScript-Entwicklers immer wieder auftaucht: npm und npx. Beide Werkzeuge sind essenziell, doch wann sollte man welches einsetzen? Was sind die genauen Unterschiede? Und was passiert technisch hinter den Kulissen? Tauchen wir ein!

npm – Der Paketmanager

npm steht für Node Package Manager und ist der Standard, wenn es darum geht, Pakete und Abhängigkeiten in der Node.js-Welt zu verwalten.

Mit npm kannst du:

• Pakete installieren – sowohl lokal für dein Projekt als auch global für dein gesamtes System.
• Abhängigkeiten verwalten – Die package.json-Datei hält fest, welche Pakete in welcher Version dein Projekt benötigt.
• Skripte ausführen – Über die scripts-Sektion in der package.json kannst du wiederkehrende Aufgaben definieren und mit npm run ausführen.

Beispiel: Um das Paket express zu deinem Projekt hinzuzufügen, verwendest du:

npm install express

Dadurch wird express in den node_modules-Ordner deines Projekts installiert und als Abhängigkeit in der package.json vermerkt.

npx – Der Paketausführer

npx wurde mit npm Version 5.2.0 eingeführt und steht für Node Package Execute. Es ermöglicht dir, Node.js-Pakete direkt auszuführen, ohne sie vorher installieren zu müssen.

Wann ist npx nützlich?

• Einmalige Ausführungen – Wenn du ein Paket nur einmalig oder selten benötigst, kannst du es mit npx ausführen, ohne es global zu installieren.
• Spezifische Versionen testen – Du kannst bestimmte Versionen eines Pakets ausführen, um beispielsweise Kompatibilitätstests durchzuführen.
• Projekt-Setup – Tools wie create-react-app können direkt über npx gestartet werden, ohne sie global installieren zu müssen.

Beispiel: Um eine neue React-Anwendung zu erstellen, kannst du folgenden Befehl verwenden:

npx create-react-app mein-projekt

Hierbei lädt npx das neueste create-react-app-Paket herunter und führt es aus, ohne es dauerhaft zu installieren.

Technische Unterschiede

Der Hauptunterschied zwischen npm und npx liegt in ihrer Funktionalität:

• npm – Installiert Pakete und verwaltet Abhängigkeiten.
• npx – Führt Pakete aus, ohne sie zwingend zu installieren.

Technisch gesehen sucht npx nach dem auszuführenden Paket in folgender Reihenfolge:

1. Lokal im Projekt – Im node_modules/.bin-Verzeichnis deines Projekts.
2. Global auf deinem System – In den globalen npm-Modulen.
3. Im npm-Registry – Falls das Paket nicht lokal oder global gefunden wird, lädt npx es temporär aus dem npm-Registry herunter und führt es aus.

Dies ermöglicht es, Pakete flexibel und ohne vorherige Installation zu nutzen, was besonders bei einmaligen Aufgaben oder Tests hilfreich ist.