To run a Laravel 11 application with Vite on a local Laravel Valet server you need an update to your vite.conf.js
to load the site properly under your domain.test
. Especially if you want to run your site post valet secure site
. You need to add the following to your Vite configuration file
server: {
host: 'site.test',
port: 5173,
https: {
key: fs.readFileSync(path.resolve(process.env.HOME, '.config/Valet/Certificates/site.test.key')),
cert: fs.readFileSync(path.resolve(process.env.HOME, '.config/Valet/Certificates/site.test.crt')),
},
},
You need to of course replace the name site
by the Valet name you gave your site. You will also need to import two packages: path and fn
import path from 'path';
import fs from 'fs';
So in the end you will have a vite.conf.js
like this or at least similar too it, especially when you use Vue as well
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
import path from 'path';
import fs from 'fs';
export default defineConfig({
plugins: [
laravel({
input: 'resources/js/app.js',
refresh: true,
}),
vue({
template: {
transformAssetUrls: {
base: null,
includeAbsolute: false,
},
},
}),
],
server: {
host: 'site.test',
port: 5173,
https: {
key: fs.readFileSync(path.resolve(process.env.HOME, '.config/Valet/Certificates/site.test.key')),
cert: fs.readFileSync(path.resolve(process.env.HOME, '.config/Valet/Certificates/site.test.crt')),
},
},
});