I've been attempting to implement SSR in my Vue app, and to achieve this I've incorporated the vue-plugin-ssr
extension. To run it with express, I created a new file named server.mjs containing the following code:
import express from "express";
import { createServer as createViteServer } from "vite";
import { renderPage } from "vite-plugin-ssr";
async function createServer() {
const app = express();
// Setting up Vite server in middleware mode and specifying the app type as 'custom' to disable Vite's HTML serving logic
const vite = await createViteServer({
server: { middlewareMode: true },
appType: "custom",
});
// Using Vite's connect instance as middleware
app.use(vite.middlewares);
app.get("*", async (req, res) => {
// Utilizing `renderPage()` for serverless environments such as Cloudflare Workers and Vercel
const { httpResponse } = await renderPage({ url: req.url });
res.send(httpResponse.body);
});
app.listen(3000);
}
createServer();
Development seems to be working fine when I run node server.mjs
. However, there is no index.html file in either the client or server folder. How can I get this set up for production? Currently, I have configured the nginx folder path to point to path/dist/client, but am I missing something else?
By the way, on production I'm receiving a "403 Forbidden" response.