server.js

import fs from 'node:fs';
import path from 'node:path';
import { fileURLToPath } from 'url';
import express from 'express';
import { basename } from './options.js';

console.log('metaUrl:', import.meta.url);

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

export async function createServer() {
  const resolve = (p) => path.resolve(__dirname, p);

  let vite = null;

  app.use(basename,
    (await import('serve-static')).default(resolve('dist/client'), {
      index: false,
    }),
  );

  app.use(basename,
    (await import('serve-static')).default(resolve('./'), {
      index: false,
    }),
  );

  app.get(basename + '/*', async (req, res) => {
    const url = req.url

    console.log('url', url);

    const template = fs.readFileSync(resolve('dist/client/index.html'), 'utf-8');
    const render = (await import('./dist/server/entry-server.js')).default;

    const appHtml = render(url); //Rendering component without any client side logic de-hydrated like a dry sponge
    const html = template.replace(`<!--app-html-->`, appHtml); //Replacing placeholder with SSR rendered components

    res.status(200).set({ 'Content-Type': 'text/html' }).end(html); //Outputing final html
  });

  return { app, vite };
}

createServer().then(({ app }) =>
  app.listen(3033, () => {
    console.log('http://localhost:3033');
  }),
);