Run Multiple Laravel Projects in XAMPP with HTTPS + Vite (Dev Mode)

Running multiple Laravel projects on XAMPP is totally doable — and you can even serve them over HTTPS with a working Vite dev server. This guide shows a clean setup for two projects using example domains.

What you’ll set up

  • Two Laravel projects in XAMPP
  • Clean URLs using virtual hosts
  • Local HTTPS certificates (trusted)
  • Vite dev server over HTTPS (no CORS errors)

1) Project structure (example)

We’ll use two example projects:

C:\xampp\htdocs\project-one C:\xampp\htdocs\project-two

Each Laravel app must serve from its public folder.

2) Enable Apache Virtual Hosts

Open:

C:\xampp\apache\conf\httpd.conf

Make sure this line is enabled:

Include conf/extra/httpd-vhosts.conf

3) Add Virtual Hosts (HTTP)

Edit:

C:\xampp\apache\conf\extra\httpd-vhosts.conf

Add:

<VirtualHost *:8080> ServerName project-one.local DocumentRoot "C:/xampp/htdocs/project-one/public" <Directory "C:/xampp/htdocs/project-one/public"> AllowOverride All Require all granted </Directory> </VirtualHost> <VirtualHost *:8080> ServerName project-two.local DocumentRoot "C:/xampp/htdocs/project-two/public" <Directory "C:/xampp/htdocs/project-two/public"> AllowOverride All Require all granted </Directory> </VirtualHost>

4) Update Windows Hosts File

Edit:

C:\Windows\System32\drivers\etc\hosts

Add:

127.0.0.1 project-one.local 127.0.0.1 project-two.local

Restart Apache. Now these work:

http://project-one.local:8080 http://project-two.local:8080

5) Add HTTPS Locally (Trusted)

Use mkcert (best option) to generate trusted certificates.

Install mkcert

winget install --id FiloSottile.mkcert -e

Create a local CA

mkcert -install

Generate certs for your domains

mkcert -cert-file "C:\xampp\apache\conf\ssl\local\local-dev.pem" ` -key-file "C:\xampp\apache\conf\ssl\local\local-dev-key.pem" ` project-one.local project-two.local

6) Add HTTPS Virtual Hosts

Edit:

C:\xampp\apache\conf\extra\httpd-ssl.conf

Add:

<VirtualHost *:443> ServerName project-one.local DocumentRoot "C:/xampp/htdocs/project-one/public" <Directory "C:/xampp/htdocs/project-one/public"> AllowOverride All Require all granted </Directory> SSLEngine on SSLCertificateFile "C:/xampp/apache/conf/ssl/local/local-dev.pem" SSLCertificateKeyFile "C:/xampp/apache/conf/ssl/local/local-dev-key.pem" </VirtualHost> <VirtualHost *:443> ServerName project-two.local DocumentRoot "C:/xampp/htdocs/project-two/public" <Directory "C:/xampp/htdocs/project-two/public"> AllowOverride All Require all granted </Directory> SSLEngine on SSLCertificateFile "C:/xampp/apache/conf/ssl/local/local-dev.pem" SSLCertificateKeyFile "C:/xampp/apache/conf/ssl/local/local-dev-key.pem" </VirtualHost>

Restart Apache. Now HTTPS works:

https://project-one.local https://project-two.local

7) Fix Vite CORS in Dev Mode (HTTPS + HMR)

If you run npm run dev, Vite serves assets on http://localhost:5173. When your site is HTTPS, the browser blocks that (CORS/mixed content).

Fix it by making Vite HTTPS too.

Edit:

project-one/vite.config.js

Example config:

import { defineConfig } from 'vite'; import laravel from 'laravel-vite-plugin'; export default defineConfig({ plugins: [ laravel({ input: [ 'resources/saas/app.scss', 'resources/js/app.js', ], refresh: true, }), ], server: { host: 'project-one.local', port: 5173, strictPort: true, cors: { origin: 'https://project-one.local', credentials: true, }, https: { key: 'C:/xampp/apache/conf/ssl/local/local-dev-key.pem', cert: 'C:/xampp/apache/conf/ssl/local/local-dev.pem', }, hmr: { host: 'project-one.local', protocol: 'wss', }, }, });

Now run:

npm run dev

Open:

https://project-one.local

No more CORS errors.

Posted in Codex Snippets

1 Comment

Join the discussion and tell us your opinion.

  1. A WordPress Commenter

    Hi, this is a comment.
    To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard.
    Commenter avatars come from Gravatar.

Leave a Comment

Your email address will not be published. Required fields are marked *

*
*