Dependencies

Die package.json ist das Herzstück eines jeden JavaScript-Projekts. Sie beschreibt das Projekt, listet seine Abhängigkeiten auf und definiert die verfügbaren Scripts.

dependencies vs. devDependencies

{
  "name": "mein-projekt",
  "type": "module",
  "dependencies": {
    "react": "^19.0.0",
    "react-dom": "^19.0.0"
  },
  "devDependencies": {
    "vite": "^6.0.0",
    "@vitejs/plugin-react": "^4.0.0",
    "typescript": "^5.0.0"
  }
}

Feld	Wann verwenden
`dependencies`	Code, der im Browser läuft — React, Zustand, UI-Bibliotheken
`devDependencies`	Werkzeuge, die nur während der Entwicklung gebraucht werden — Bundler, Compiler, Linter, Test-Runner

Der Unterschied ist besonders relevant, wenn Pakete selbst als Bibliothek veröffentlicht werden — dort schlucken dependencies die konsumierenden Projekte mit. Für Applikationen (wie eine React-App) ist die Trennung weniger kritisch, aber es ist eine gute Konvention, die Absicht klarzumachen.

Das Scripts-Feld

{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "typecheck": "tsc"
  }
}

Scripts sind Kurzkommandos, die mit npm run <name> ausgeführt werden. Der Vorteil: lokal installierte Werkzeuge (aus node_modules/.bin/) werden automatisch gefunden — vite funktioniert, obwohl es nicht global installiert ist.

Der Lockfile

Beim ersten npm install wird eine package-lock.json erzeugt. Sie enthält die exakten Versionen aller installierten Pakete — auch der transitiven Abhängigkeiten (Pakete, die deine Pakete brauchen).

package.json       → "react": "^19.0.0"   (Versionsbereich)
package-lock.json  → "react": "19.0.0"    (exakte Version)

Der Lockfile gehört ins Git-Repository. Er stellt sicher, dass alle Entwickler und die CI-Pipeline exakt dieselben Paketversionen verwenden — unabhängig davon, wann sie npm install ausführen.