Meta tags:
description=Frontend-Tooling der nächsten Generation;

Headings (most frequently used words):

vite, projekt, community, root, erste, schritte, einführung, guide, apis, environment, api, überblick, browser, unterstützung, online, ausprobieren, scaffolding, für, ihr, erstes, vorlagen, manuelle, installation, index, html, und, befehlszeilenschnittstelle, cli, unveröffentlichte, commits, verwenden, alternative, verzeichnisse, spezifizieren,

Text of the page (most frequently used words):
vite (87), sie (46), bash (26), die (24), und (19), npm (19), können (19), der (19), mit (18), projekt (17), für (17), das (17), pnpm (16), auf (15), ist (15), vue (15), von (13), ein (12), create (11), aus (10), den (10), werden (10), yarn (10), eine (10), dass (9), bun (9), html (9), wie (8), build (8), https (8), über (8), deno (8), oder (7), #verwenden (7), des (7), add (7), einem (7), als (7), index (7), browser (7), github (6), ihrem (6), auch (6), new (6), cli (6), dev (6), wird (6), erstellen (6), react (6), template (6), api (6), wenn (5), community (5), unter (5), dem (5), sha (5), pkg (5), root (5), bei (5), javascript (5), module (5), project (5), vorlagen (5), app (5), diese (4), sich (4), abhängigkeiten (4), version (4), install (4), funktionen (4), npx (4), sind (4), unterstützt (4), statischen (4), quellcode (4), ihr (4), frameworks (4), qwik (4), solid (4), svelte (4), lit (4), preact (4), vanilla (4), plugins (4), seite (3), mehr (3), erfahren (3), neue (3), dokumentation (3), dann (3), führen (3), zum (3), entwicklungsserver (3), link (3), run (3), com (3), innerhalb (3), angeben (3), ausführen (3), preview (3), server (3), ihren (3), direkt (3), verwendung (3), aktuellen (3), wurzelverzeichnis (3), code (3), setup (3), entwicklung (3), user (3), tool (3), einer (3), vorlage (3), online (3), ausprobieren (3), stackblitz (3), kann (3), interaktive (3), konfiguration (3), produktion (3), plugin (3), möglich (3), erste (3), schritte (3), docs (3), philosophie (2), änderungen (2), haben (2), benötigen (2), discord (2), ersetzen (2), überschreibungen (2), veröffentlicht (2), ansehen (2), basierten (2), paketmanager (2), verwendet (2), neuesten (2), sein (2), package (2), for (2), vitejs (2), git (2), ihrer (2), lokalen (2), bauen (2), beachten (2), nur (2), commits (2), funktionieren (2), veröffentlichungen (2), commit (2), installieren (2), befehlszeilenschnittstelle (2), zusätzliche (2), optionen (2), production (2), serve (2), json (2), seine (2), config (2), http (2), ihre (2), bereitgestellt (2), verzeichnis (2), urls (2), aufgelöst (2), was (2), sogar (2), css (2), damit (2), darüber (2), hinaus (2), keine (2), script (2), type (2), während (2), befehl (2), installation (2), tiged (2), main (2), nach (2), schnell (2), awesome (2), andere (2), tools (2), projektnamen (2), weitere (2), details (2), swc (2), init (2), latest (2), verwendende (2), erfordert (2), node (2), scrimba (2), available (2), legacy (2), lesen (2), abschnitt (2), erstellung (2), baseline (2), bereitstellen (2), dieser (2), hauptversion (2), unterstützung (2), integration (2), guide (2), assets (2), hmr (2), frontend (2), viteconf (2), environment (2), einführung (2), navigation (2), فارسی (2), 한국어 (2), português (2), español (2), 日本語 (2), 简体中文 (2), english (2), deutsch (2), 2019, heute, voidzero, inc, mitwirkende, 84cff218, nächste, pager, vorschlagen, fragen, hilfe, wenden, discussions, transitiv, verwendeter, sollten, benutzen, wann, releases, release, gehen, globalen, verlinken, starten, nun, neu, stand, use, your, preferred, manager, this, step, packages, clone, alternativ, maschine, klonen, anschließend, selbst, verknüpfen, required, repository, irgendeinem, letzten, monats, ältere, gelöscht, vites, shas, nicht, warten, testen, einen, spezifischen, unveröffentlichte, vollständige, liste, erhalten, help, open, port, locally, start, aliases, scripts, installiert, binary, skripten, hier, standardmäßigen, skripte, gerüsteten, startet, arbeitsverzeichnisses, alternatives, projektstammes, auflöst, verschieben, müssen, geändert, konfigurationsdatei, some, sub, dir, alternative, verzeichnisse, spezifizieren, mehreren, einstiegspunkten, mehrseitige, anwendungen, ähnlich, servern, gibt, dateien, gesamten, dieses, verwiesen, absolute, projektstamms, basis, schreiben, normalen, dateiserver, arbeiten, würden, viel, leistungsfähiger, lage, umzugehen, orten, außerhalb, dateisystems, monorepo, nutzbar, macht, behandelt, teil, modulgraphen, löst, verweist, inline, referenziert, genießen, spezifische, eigenschaften, automatisch, umbasiert, speziellen, platzhalter, erforderlich, public_url, href, src, sache, ihnen, vielleicht, aufgefallen, vorderster, stelle, steht, anstatt, versteckt, beabsichtigt, einstiegspunkt, anwendung, public, localhost, 5173, bunx, entsprechenden, terminal, hallo, datei, folgt, manuelle, unterlegen, angenommen, befindet, standardzweig, lokale, kopie, indem, zur, url, projekts, hinzufügen, man, basisvorlage, gängige, finden, enthalten, abzielen, gepflegte, ohne, aufforderungen, flag, interactive, gerüst, siehe, jeder, unterstützten, extra, double, dash, needed, befehlszeilenoptionen, beispiel, scaffold, kommandozeilenoptionen, einige, jedoch, höhere, bitte, aktualisieren, davor, warnt, kompatibilitätshinweis, sehen, lektion, folgen, anweisungen, scaffolding, erstes, typescript, folgende, führt, basierte, fast, identisch, aber, rechner, navigieren, framework, auszuwählen, produktions, builds, zielt, standardmäßig, widely, vor, mindestens, jahren, wurden, ziel, herabgesetzt, zusätzlich, offizielle, geht, davon, moderner, genutzt, bedeutet, großteil, funktionalitäten, diesem, grund, setzt, dadurch, syntaxreduktion, verhindert, sodass, nah, ursprünglichen, fügt, etwas, laufzeitcode, funktioniert, nutzt, zeitpunkt, jeweiligen, veröffentlichung, 2026, newly, transformationsziel, esnext, lernen, durch, tutorials, beweggründe, warum, vollständiger, typisierungsunterstützung, hohem, maße, erweiterbar, meinungsfreudig, vernünftigen, standardeinstellungen, ausgeliefert, alles, anderen, erklärt, bedarf, anpassen, section, features, bündelt, vorkonfiguriert, hochoptimierte, statische, ausgibt, rollup, quelldateien, erstaunlich, schnellem, bereitstellt, hot, replacement, umfangreichen, integrierten, native, französisches, wort, ausgesprochen, veet, art, erfahrung, erheblich, verbessert, besteht, zwei, hauptbestandteilen, überblick, aufzeichnungen, 2025, gemeinsam, runtimes, instanzen, apis, grundlegende, migration, leistung, fehlerbehebung, backend, serverseitiges, rendern, ssr, umgebungsvariablen, modi, website, umgang, vorbündeln, wieso, sidebar, return, top, menu, appearance, unreleased, contributing, changelog, chat, mastodon, bluesky, anerkennungen, blog, team, ressourcen, leitfaden, skip, content, ankündigung, einheitliche, toolchain, web,

Text of the page (random words):
erste schritte vite vite ankündigung die einheitliche toolchain für das web skip to content main navigation leitfaden konfiguration plugins ressourcen team blog veröffentlichungen anerkennungen die dokumentation bluesky mastodon x discord chat awesome vite viteconf dev community v4 3 0 changelog contributing unreleased docs vite 3 docs vite 2 docs deutsch english 简体中文 日本語 español português 한국어 فارسی appearance deutsch english 简体中文 日本語 español português 한국어 فارسی menu return to top sidebar navigation einführung erste schritte projekt philosophie wieso vite guide funktionen cli plugins verwenden vorbündeln von abhängigkeiten umgang mit statischen assets erstellung für die produktion bereitstellen einer statischen website umgebungsvariablen und modi serverseitiges rendern ssr backend integration fehlerbehebung leistung migration von v3 grundlegende änderungen apis plugin api hmr api javascript api konfiguration environment api einführung environment instanzen plugins frameworks runtimes auf dieser seite gemeinsam bauen viteconf 2025 aufzeichnungen ansehen erste schritte überblick vite französisches wort für schnell ausgesprochen vi t wie veet ist eine neue art von frontend build tool das die erfahrung bei der frontend entwicklung erheblich verbessert es besteht aus zwei hauptbestandteilen einem entwicklungsserver der ihre quelldateien über native es module mit umfangreichen integrierten funktionen und erstaunlich schnellem hot module replacement hmr bereitstellt einem build befehl der ihren code mit rollup bündelt und so vorkonfiguriert ist dass er hochoptimierte statische assets für die produktion ausgibt vite ist meinungsfreudig und wird mit vernünftigen standardeinstellungen ausgeliefert lesen sie im features guide nach was alles möglich ist unterstützung für frameworks oder integration mit anderen tools ist über plugins möglich die config section erklärt wie sie vite bei bedarf an ihr projekt anpassen können darüber hinaus ist vite über seine plugin api und javascript api mit vollständiger typisierungsunterstützung in hohem maße erweiterbar mehr über die beweggründe für das projekt erfahren sie im abschnitt warum vite lernen sie vite durch interaktive tutorials auf scrimba browser unterstützung während der entwicklung geht vite davon aus dass ein moderner browser genutzt wird das bedeutet der browser unterstützt den großteil der aktuellen javascript und css funktionalitäten aus diesem grund setzt vite esnext als transformationsziel dadurch wird eine syntaxreduktion verhindert sodass vite module so nah wie möglich am ursprünglichen quellcode bereitstellen kann vite fügt etwas laufzeitcode ein damit der entwicklungsserver funktioniert dieser code nutzt funktionen aus der baseline newly available zum zeitpunkt der jeweiligen veröffentlichung der hauptversion 01 05 2026 für diese hauptversion für produktions builds zielt vite standardmäßig auf browser ab die in der baseline widely available sind das sind browser die vor mindestens 2 5 jahren veröffentlicht wurden das ziel kann in der konfiguration herabgesetzt werden zusätzlich können legacy browser über das offizielle vitejs plugin legacy unterstützt werden lesen sie den abschnitt erstellung für die produktion für weitere details vite online ausprobieren sie können vite online auf stackblitz ausprobieren es führt das vite basierte build setup direkt im browser aus so dass es fast identisch mit dem lokalen setup ist aber keine installation auf ihrem rechner erfordert sie können zu vite new template navigieren um das zu verwendende framework auszuwählen folgende vorlagen werden unterstützt javascript typescript vanilla vanilla ts vue vue ts react react ts preact preact ts lit lit ts svelte svelte ts solid solid ts qwik qwik ts scaffolding für ihr erstes vite projekt npm yarn pnpm bun deno bash npm create vite latest bash yarn create vite bash pnpm create vite bash bun create vite bash deno init npm vite folgen sie dann den anweisungen sehen sie sich eine interaktive lektion auf scrimba an kompatibilitätshinweis vite erfordert node js version 20 19 22 12 einige vorlagen benötigen jedoch eine höhere node js version um zu funktionieren bitte aktualisieren sie diese wenn ihr paketmanager sie davor warnt verwendung von create vite mit kommandozeilenoptionen sie können auch direkt den projektnamen und die zu verwendende vorlage über zusätzliche befehlszeilenoptionen angeben führen sie zum beispiel ein vite vue projekt aus um ein scaffold zu erstellen npm yarn pnpm bun deno bash npm 7 extra double dash is needed npm create vite latest my vue app template vue bash yarn create vite my vue app template vue bash pnpm create vite my vue app template vue bash bun create vite my vue app template vue bash deno init npm vite my vue app template vue siehe create vite für weitere details zu jeder unterstützten vorlage vanilla vanilla ts vue vue ts react react ts react swc react swc ts preact preact ts lit lit ts svelte svelte ts solid solid ts qwik qwik ts sie können für den projektnamen verwenden um im aktuellen verzeichnis ein gerüst zu erstellen um ein projekt ohne interaktive aufforderungen zu erstellen können sie die no interactive flag verwenden community vorlagen create vite ist ein tool mit dem man schnell ein projekt aus einer basisvorlage für gängige frameworks erstellen kann bei awesome vite finden sie von der community gepflegte vorlagen die andere tools enthalten oder auf andere frameworks abzielen für eine vorlage unter https github com user project können sie sie online unter https github stackblitz com user project ausprobieren indem sie stackblitz nach github zur url des projekts hinzufügen sie können auch ein tool wie tiged verwenden um ihr projekt mit einer der vorlagen zu unterlegen angenommen das projekt befindet sich auf github und verwendet main als standardzweig können sie eine lokale kopie erstellen bash npx tiged user project my project cd my project npm install npm run dev manuelle installation in ihrem projekt können sie das vite cli mit installieren npm yarn pnpm bun deno bash npm install d vite bash yarn add d vite bash pnpm add d vite bash bun add d vite bash deno add d npm vite und eine index html datei wie folgt erstellen html p hallo vite p dann führen sie den entsprechenden cli befehl in ihrem terminal aus npm yarn pnpm bash npx vite bash yarn vite bash pnpm vite bash bun bunx vite bash deno deno run a npm vite die index html wird auf http localhost 5173 bereitgestellt index html und projekt root eine sache die ihnen vielleicht aufgefallen ist ist dass in einem vite projekt index html an vorderster stelle steht anstatt in public versteckt zu sein das ist beabsichtigt während der entwicklung ist vite ein server und index html ist der einstiegspunkt zu ihrer anwendung vite behandelt die index html als quellcode und teil des modulgraphen es löst script type module src auf das auf ihren javascript quellcode verweist sogar inline script type module und css werden über link href referenziert und genießen damit vite spezifische eigenschaften darüber hinaus werden urls innerhalb von index html automatisch umbasiert so dass keine speziellen platzhalter für public_url erforderlich sind ähnlich wie bei statischen http servern gibt es bei vite ein wurzelverzeichnis von dem aus ihre dateien bereitgestellt werden in der gesamten dokumentation wird auf dieses verzeichnis als root verwiesen absolute urls in ihrem quellcode werden unter verwendung des projektstamms als basis aufgelöst so dass sie code schreiben können als ob sie mit einem normalen statischen dateiserver arbeiten würden nur viel leistungsfähiger vite ist auch in der lage mit abhängigkeiten umzugehen die zu orten außerhalb des root dateisystems aufgelöst werden was es sogar in einem monorepo basierten setup nutzbar macht vite unterstützt auch mehrseitige anwendungen mit mehreren html einstiegspunkten alternative root verzeichnisse spezifizieren das ausführen von vite startet den dev server unter verwendung des aktuellen arbeitsverzeichnisses als root sie können ein alternatives wurzelverzeichnis mit vite serve some sub dir angeben beachten sie dass vite auch seine konfigurationsdatei d h vite config js innerhalb des projektstammes auflöst so dass sie diese verschieben müssen wenn das wurzelverzeichnis geändert wird befehlszeilenschnittstelle cli in einem projekt in dem vite installiert ist können sie das vite binary in ihren npm skripten verwenden oder es direkt mit npx vite ausführen hier sind die standardmäßigen npm skripte in einem gerüsteten vite projekt package json json scripts dev vite start dev server aliases vite dev vite serve build vite build build for production preview vite preview locally preview production build sie können zusätzliche cli optionen wie port oder open angeben eine vollständige liste der cli optionen erhalten sie wenn sie npx vite help in ihrem projekt ausführen erfahren sie mehr über die befehlszeilenschnittstelle unveröffentlichte commits verwenden wenn sie nicht auf eine neue version warten können um die neuesten funktionen zu testen können sie einen spezifischen commit von vite installieren mit https pkg pr new npm yarn pnpm bun bash npm install d https pkg pr new vite sha bash yarn add d https pkg pr new vite sha bash pnpm add d https pkg pr new vite sha bash bun add d https pkg pr new vite sha ersetzen sie sha mit irgendeinem von vites commit shas beachten sie dass nur commits innerhalb des letzten monats funktionieren werden da ältere veröffentlichungen gelöscht werden alternativ können sie auch das vite repository auf ihrer lokalen maschine klonen anschließend bauen und es selbst verknüpfen pnpm is required bash git clone https github com vitejs vite git cd vite pnpm install cd packages vite pnpm run build pnpm link use your preferred package manager for this step gehen sie dann zu ihrem vite basierten projekt und führen sie pnpm link vite aus oder den paketmanager den sie zum globalen verlinken von vite verwendet haben starten sie nun den entwicklungsserver neu um auf dem neuesten stand zu sein um mehr zu erfahren wie und wann vite neue releases veröffentlicht können sie sich die release dokumentation ansehen abhängigkeiten die vite benutzen um die von abhängigkeiten transitiv verwendeter vite version zu ersetzen sollten sie npm überschreibungen oder pnpm überschreibungen verwenden community wenn sie fragen haben oder hilfe benötigen wenden sie sich an die community unter discord und github discussions änderungen für diese seite vorschlagen pager nächste seite projekt philosophie 2019 heute voidzero inc und mitwirkende von vite 84cff218