- Первый модульный компонент Vue3 в Laravel проекте
resources\js\components\MyTest.vue
<template>
<div>test</div>
</template>
- регистрируем компонент Vue в Laravel проекте
resources\js\app.js
require('./bootstrap');
import {createApp} from 'vue';
//главный компонент
import App from 'components/../App.vue';
//компоненты
import comp1 from 'components/comp1.vue';
import comp2 from 'components/comp2.vue';
//создание главного компонента
//и регистрация внутри него других компонентов
const app=createApp(App);
app.component('comp-1',comp1);
app.component('comp-2',comp2);
app.mount('#app');
- На шаблоне Laravel проекта
(пример resources\views\index.blade.php)
размещение Vue3 компонента в id=»app» (примере my-test)
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="app"></div>
<script src="./js/app.js"></script>
</body>
</html>
- создание роуминга Laravel
для шаблона (пример resources\view\index.blade.php)
как главной страницы
на routes\web.php
...
Route::get('/', function () {
return view('index');
});
...
