Cuando usamos Vite para crear una aplicación web usando JavaScript que se ejecuta del lado del cliente lo único que debemos hacer para que los usuarios puedan disfrutar de nuestra creación es servir el JS, CSS, HTML y demás archivos como archivos estáticos.
Yo usaba Apache y ahora uso Nginx: ambos funcionan para servir archivos estáticos, pero cuando uso Vite me he encontrado con problemas en la ruta base para servir los archivos, por ello es que en este tutorial te explico cómo configuro la base path para que puedas colocarla en cualquier carpeta de Nginx o Apache y funcione usando rutas relativas.
En el vite.config.js o vite.config.ts hay
que configurar base así:
import { defineConfig } from 'vite';
export default defineConfig({
base: "./",
});
Y con eso se va a tomar una ruta relativa desde donde se sirva el proyecto. Con esto
podemos subir el contenido de dist (después de hacer un npm run build) a cualquier
servidor de contenido estático como Apache o Nginx.
La ventaja de esto es que podemos subir la app sin que
conozcamos la ruta absoluta en donde vivirá. Yo lo hago así, copio mi dist
a mi localhost (con XAMPP) y una vez que veo que sirve lo envío a mi servidor
con scp o rsync.