ilk laravel kur.
npm install –save-dev vue @vitejs/plugin-vue
vite.config.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
import { defineConfig } from 'vite'; import laravel from 'laravel-vite-plugin'; import vue from '@vitejs/plugin-vue' export default defineConfig({ plugins: [ laravel({ input: ['resources/css/app.css', 'resources/js/app.js'], refresh: true, }), vue({ template: { base: null, includeAbsolute: false } }) ], }); |
npm run dev yap bi gör abim çalışıp çalışmadığını.
composer require inertiajs/inertia-laravel
welcome.blade.phpye aşağıdaki kodu yaz.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<!DOCTYPE html> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Laravel Zero</title> @vite('resources/js/app.js') @inertiaHead </head> <body> @inertia </body> </html> |
https://inertiajs.com/client-side-setup (burada vue3 kısmından kurabilirsiniz şimdiki halini sırayla yazıyorum)
npm install @inertiajs/vue3
bootstrap.js’i sil resources/js içindeki. çöp o. kullanmayacağız.
app.js’e aşağıdaki kodu yazabilirsin.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
import { createApp, h } from 'vue' import { createInertiaApp } from '@inertiajs/vue3' createInertiaApp({ resolve: name => { const pages = import.meta.glob('./Pages/**/*.vue', { eager: true }) return pages[`./Pages/${name}.vue`] }, setup({ el, App, props, plugin }) { createApp({ render: () => h(App, props) }) .use(plugin) .mount(el) }, }) |
web.php içindeki route’u sil.
böylelikle bomboş 404 hatası aldığımız sayfa kalacak sadece geriye.