Unable to apply Jquery. Also getting 404 for other routes except index

[anshumanb (Anshuman Bhardwaj)]

Hi @shayokhshorfuddin, thanks for trying the solution.

I’ve cloned and deployed your project (live here) successfully after doing the following changes:

1. You must pay attention to the build warnings, here it says that to include the jquery scripts you must declare them as type="module" in the script tags.
   
   
   
   So, I did it like this (you must do it for all warnings):
   
   
2. To use Vite for multi-page apps, according to the Vite docs you must update the vite.config.js file, as follow:

import { dirname, resolve } from "node:path";
import { fileURLToPath } from "node:url";
import { defineConfig } from "vite";

const __dirname = dirname(fileURLToPath(import.meta.url));

export default defineConfig({
  build: {
    rollupOptions: {
      input: {
        main: resolve(__dirname, "index.html"),
        "page-2": resolve(__dirname, "page-2.html"),
        "page-3": resolve(__dirname, "page-3.html"),
        "page-4": resolve(__dirname, "page-4.html"),
        "page-5": resolve(__dirname, "page-5.html"),
        "page-6": resolve(__dirname, "page-6.html"),
        "page-9": resolve(__dirname, "page-9.html"),
        "page-10": resolve(__dirname, "page-10.html"),
        "profile-page": resolve(__dirname, "profile-page.html"),
        "order-details": resolve(__dirname, "order-details.html"),
      },
    },
  },
});

3. Use the default Vite preset in the Vercel project settings.
   
   

After doing these changes your project works fine on Vercel. Try it here: https://restaurant-phi-beige.vercel.app/