chore: improve ssr example

examples/ssr/index.js

@@ -0,0 +1,36 @@
+import path from 'path'
+import fs from 'fs-extra'
+import template from 'lodash/template'
+import { createRenderer } from 'vue-server-renderer'
+import consola from 'consola'
+import createApp from './server-entry'
+
+const renderer = createRenderer()
+
+async function createPage() {
+  const templateFile = path.resolve(__dirname, 'app.template.html')
+  const templateContent = await fs.readFile(templateFile, { encoding: 'utf8' })
+
+  // see: https://lodash.com/docs#template
+  const compiled = template(templateContent, { interpolate: /{{([\s\S]+?)}}/g })
+
+  const webpackAssets = '<link rel="stylesheet" href="../global.css">'
+  const serverApp = await createApp()
+  const appHtml = await renderer.renderToString(serverApp)
+
+  const pageHtml = compiled({
+    app: appHtml,
+    webpackAssets,
+    ...serverApp.$meta().inject()
+  })
+
+  return pageHtml
+}
+
+consola.info(`Creating ssr page`)
+createPage()
+  .then((pageHtml) => {
+    consola.info(`Done, page:`)
+    consola.log(pageHtml)
+  })
+  .catch(e => consola.error(e))