How do I setup a multi page app using vite?

Question

I am trying to setup a vite project that has multiple entry points.

https://stackblitz.com/edit/vitejs-vite-swtkdv

It is a pretty basic setup taken straight from the vite website that uses vanilla flavour. Only things which I have updated are the following:

• add vite.config.js file with configuration for multiple entry points (check the attached stackblitz link)
• add new files: login/index.html; login/login.js (check the attached stackblitz link)

What I expect to happen is everytime I enter url/login, it should load the page ./login/index.html. However in reality it keeps on loading the ./index.html.

Answer 1

Your code is correct and should work exactly as they described in the docs, the problem is you typed http://localhost:5173/login into the browser and expected ./login/index.html to be rendered.

In the docs they said, that with your code, in order to render ./login/index.html you should type http://localhost:5173/login/ into the browser. I.e. your previous URL was missing the / at the end.

https://vitejs.dev/guide/build.html#multi-page-app: