TooTallNate / test-marko-vite-vercel

Just a simple reduced test for figuring out how to deploy a Marko + Vite build on Vercel.

Marko + Vite + Vercel

A reduced Marko + Vite build to figure out Vercel deployments with this setup.

📦 Dependencies

• marko (Docs)
• @marko/vite (Docs)
• @marko/express (Docs)
• vite (Docs)
• express

🤖 Commands

• 🧪 Dev: npm run dev
• 🏗️ Build: npm run build (Compiles to dist and builds a production-ready node server)
• Build Client: npm run build:client (Builds client side only)
• Build Server: npm run build:server (Builds server side only)
• 🏁 Serve: npm run start (Run the production server)

🧭 Info

This is a Marko project, bundled by Vite and served up by Express.

We're [the Marko team's office Marko Vite plugin, which is running in the default "linked mode", using Vite's SSR API.

While Vercel now offers a config-free Vite option, the integration with Marko and SSR makes this a unique case.

To deploy this setup on Vercel, I'd imagine we have to use:

• Vercels File System API
• Perhaps the vite-plugin-ssr plugin

📌 Other resources

• Using Vite on Vercel
• Marko Hacknews w/ Vite + Cloudflare: Similar idea.

Let's figure out how to get it deployed on Vercel.

Project Organization

|--public
|--src
  |--components
  |--pages
  |--styles
  |--index.js // Routes
|--index.js // Dev / Prod server with Marko middleware
|--vite.config.js // Vite configuration with Marko-vite plugin