Vue Starter Router

Author: atomjoy

README.md

@@ -1,4 +1,4 @@
-# Laravel 11 vue 3.4 Starter
+# Laravel 11 vue 3.4 Starter Router
 
 Pobierz repozytorium z githuba rozpakuj i przejdż do katalogu.
 

README_DEV.md

@@ -13,6 +13,7 @@ npm install
 npm install axios
 npm install vue@latest
 npm install --save-dev @vitejs/plugin-vue
+npm install vue-router@4
 ```
 
 ### Kompilacja
@@ -60,15 +61,19 @@ php artisan migrate:fresh --env=testing
 php artisan storage:link
 ```
 
-### Tłumaczenia
+### Uruchom
 
 ```sh
-php artisan lang:publish
+php artisan serve
+php artisan serve --host=localhost --port=8000
 ```
 
-### Uruchom
+### Inne opcje
 
 ```sh
-php artisan serve
-php artisan serve --host=localhost --port=8000
+# Tłumaczenia
+php artisan lang:publish
+
+# Strony błędów
+php artisan vendor:publish --tag=laravel-errors
 ```

composer.json

@@ -1,5 +1,5 @@
 {    
-    "version": "1.0",
+    "version": "2.0",
     "name": "laravel/laravel",
     "type": "project",
     "description": "The skeleton application for the Laravel framework.",

package-lock.json

@@ -12,6 +12,7 @@
         "vite": "^5.0"
     },
     "dependencies": {
-        "vue": "^3.4.21"
+        "vue": "^3.4.21",
+        "vue-router": "^4.3.0"
     }
 }

package.json

@@ -1,7 +1,13 @@
+<script setup>
+import { RouterLink, RouterView } from 'vue-router'
+</script>
+
 <template>
-    <div class="section">
-        <h1>Laravel Vue Starter</h1>
-        <p>Laravel 11 Vue 3.4 app starter with Vite.</p>
-    </div>
+    <!-- 
+        <nav>
+            <RouterLink to="/">Home</RouterLink>
+            <RouterLink to="/about">About</RouterLink>
+        </nav>
+    -->
+	<RouterView />
 </template>
-<script setup></script>

public/logo/logo-dark.png

@@ -2,5 +2,10 @@ import './bootstrap'
 
 import {createApp} from 'vue'
 import App from './App.vue'
+import router from './router'
 
-createApp(App).mount("#app")
+const app = createApp(App)
+
+app.use(router)
+
+app.mount("#app")