Multiple Distributions on Port 5173

[dharnil]

Use Case: Multi-Project Development on Single Device

Actors

• Project 1 active with bun run dev script
• Project 2 active with bun run dev script

Config

• Project 1
  • Base url set to my-project
  • bunx create-vite my-project --template vue-ts
• Project 2
  • Boiler Plate Code
  • bunx create-vite my-vue-app --template vue-ts

Behaviour

Both projects run on port 5173 of localhost.

• Project 1 is served on
  • localhost:5173/my-project
• Project 2 is served on
  • localhost:5173

Issue

On Vite Documentation it states that if the port is in use, it will switch to a different port.

https://vitejs.dev/config/server-options.html#server-port

• I am currently unsure how to fix this issue or user error.

Possibly if someone could point me in the right direction.

[chenxch]

plan A: multi-page-app

plan B: proxy

export default defineConfig({
  server: {
    proxy: {
      '/my-project': 'http://localhost:5174',
    },
  },
})