Generator vite.config.js
Gotowa konfiguracja Vite dla Laravel, React i Vue
-
1Wprowadź dane
Wpisz treść, wklej tekst lub załaduj plik z dysku. -
2Kliknij przycisk
Narzędzie natychmiast przetworzy Twoje dane w przeglądarce. -
3Pobierz wynik
Skopiuj gotowy tekst lub zapisz plik na urządzeniu.
return "Wynik gotowy w 0.1s";
}
Oceń to narzędzie:
Powiązane narzędzia
Inne narzędzia, które mogą Ci się przydaćGenerator konfiguracji Vite
Vite to nowoczesne narzędzie do budowania frontendu — błyskawiczny serwer deweloperski i szybki build produkcyjny. Zastąpił Webpacka m.in. w Laravelu.
Obsługiwane projekty
| Projekt | Wtyczka |
|---|---|
| Laravel | laravel-vite-plugin |
| React | @vitejs/plugin-react |
| Vue | @vitejs/plugin-vue |
| Vanilla JS | brak (tylko rdzeń) |
Najważniejsze opcje
- server.port — port serwera deweloperskiego (domyślnie 5173).
- server.https — włącza HTTPS lokalnie.
- resolve.alias — skróty importów, np.
@. - build.outDir — katalog wynikowy buildu.
Przykład
Dla Laravela wtyczka przyjmuje listę wejść (resources/css/app.css, resources/js/app.js) i włącza odświeżanie przeglądarki (refresh: true) przy zmianach w szablonach.
Najczęstsze pytania
Jak zainstalować zależności?
Użyj npm i -D vite oraz wtyczki właściwej dla frameworka, np. npm i -D laravel-vite-plugin.
Czym Vite różni się od Webpacka?
Vite w trybie dev serwuje moduły natywnie (ESM), więc start jest niemal natychmiastowy. Build produkcyjny opiera się na Rollup.
Jak uruchomić builind?
npm run dev w trybie deweloperskim, npm run build — produkcyjnie. Skrypty definiuje się w package.json.