Laravel выходит из коробки с Laravel Mix, который вы можете использовать для компиляции вашего проекта Vue, и обслуживаете его через Laravel.
Вот шаги, чтобы сделать это.
Сначала вы копируете весь проект Vue в /resources/render
(вы можете изменить render
на что угодно).
Перейдите в корневую папку Laravel и откройте файл с именем webpack.mix.js
и измените его на следующий
const mix = require('laravel-mix');
// Assuming your Vue entry point is index.js
mix.js('resources/render/index.js', 'public/js');
Создать блейд-файл в качестве точки входа в resources/views
. В моем случае это main.blade.php
.
<!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</title>
</head>
<body>
<div id="app">
{{-- Content --}}
</div>
</body>
<script type="application/javascript" src="{{ mix('js/app.js') }}"></script>
</html>
Перейдите к своему routes/web.php
и укажите только этот маршрут. Он будет обрабатывать все маршруты в вашем приложении Vue
Route::get('{path}', function () {
return view('index');
})->where('path', '^(.+)?$');
Запустите npm install
и npm run watch
, чтобы создать и отреагировать на изменения, внесенные в приложение Vue. (Возможно, вы захотите удалить нежелательные зависимости из package.json
)
У меня есть похожий проект с этой настройкой. Вы можете увидеть это здесь для лучшего понимания