Чтобы запустить проект Laravel с помощью Vite, вы можете выполнить следующие действия:
Шаг 1. Создайте новый проект Laravel
composer create-project --prefer-dist laravel/laravel myproject
cd myproject
Шаг 2. Установите пакет пользовательского интерфейса Laravel
composer require laravel/ui
Шаг 3. Создайте каркас пользовательского интерфейса Laravel
php artisan ui react --auth
Шаг 4. Установите Vite
npm init -y
npm install --save-dev vite
Шаг 5. Настройка Vite
Создайте vite.config.js
const { createVuePlugin } = require('vite-plugin-vue2');
module.exports = {
plugins: [createVuePlugin()],
};
Шаг 6. Обновите конфигурацию Laravel Mix
Откройте файл webpack.mix.jsи замените его содержимое следующим кодом:
const mix = require('laravel-mix');
const { VitePlugin } = require('laravel-mix-vite');
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css')
.vite({
config: 'vite.config.js',
clearConsole: true,
})
.webpackConfig({
devServer: {
proxy: {
'*': 'http://localhost:8000',
},
},
});
Шаг 7. Запустите сервер разработки
npm run dev
Выполняя эти шаги, вы настроили проект Laravel с Vite в качестве инструмента сборки внешнего интерфейса. Теперь вы можете начать писать компоненты Vue или React, используя сервер быстрой разработки Vite.