RSS DEV-Gemeinschaft

Ultimativer Starter-Leitfaden für Laravel 12 und Vue 3

Um ein Laravel 12-Projekt mit Vue 3 und Vite einzurichten, beginnen Sie damit, Laravel 12 über Composer mit dem Befehl `composer create-project --prefer-dist laravel/laravel mein-laravel-app` zu installieren. Konfigurieren Sie dann die Umgebung, indem Sie die Datei `.env.example` duplizieren, einen Anwendungs-Schlüssel generieren und die Datei `.env` mit Datenbank-Zugangsdaten aktualisieren. Installieren Sie als Nächstes Node-Module mit `npm install` und installieren Sie Vue und weitere Abhängigkeiten mit `npm install vue@latest vue-router@latest @vitejs/plugin-vue`. Konfigurieren Sie Vite für Vue, indem Sie die Datei `vite.config.js` ändern. Erstellen Sie einen Einstiegspunkt für die Vue-App, indem Sie die Datei `resources/js/app.js` ändern, und erstellen Sie ein Beispiel-Vue-Komponente, indem Sie die Datei `resources/js/components/App.vue` erstellen. Richten Sie Vue Router ein, indem Sie Vue Router installieren und die Dateien `resources/js/router/index.js` und `resources/js/components/Home.vue` erstellen. Aktualisieren Sie die Blade-Vorlage, indem Sie die Datei `resources/views/app.blade.php` ändern, um Vue einzubinden. Kompilieren Sie abschließend die Assets mit Vite mit `npm run dev` und starten Sie den Laravel-Server mit `php artisan serve`. Diese Einrichtung bietet eine solide Grundlage für den Bau von skalierbaren und leistungsstarken Webanwendungen. Sie können Ihr Projekt erweitern, indem Sie Authentifizierung, API-Handling, Zustandsverwaltung und mehr hinzufügen. Mit diesem Leitfaden können Sie Ihre Entwicklungsjourney starten und moderne Webanwendungen mit Laravel 12 und Vue 3 erstellen.
favicon
dev.to
Laravel 12 and Vue 3 Ultimate Starter Guide
Bild zum Artikel: Ultimativer Starter-Leitfaden für Laravel 12 und Vue 3