Add a hook to modify the body

[yaquawa]

I'd been finding a way to append extra string to the body:

vite-ssr/src/vue/entry-server.js

Line 60 in f0a7e02

const body = await renderToString(app, context)

Because I'm using this state management lib:
https://github.com/andrewcourtice/harlem/tree/main/plugins/ssr

to enable the SSR feature of it, it requires appending extra state data to the rendered string.
I wasn't able to find a way to do that, so would you add a hook that allows modify the body?
Thanks!

[frandiox]

Yeah I was thinking in adding some kind of hook to optionally use devalue instead of JSON.stringify. I think it would work for this as well 🤔
I'll have a look at it tomorrow probably.

[yaquawa]

Thanks a lot!

[frandiox]

@yaquawa So I actually misunderstood what you needed here. What I meant was a hook to modify initialState instead of body. However, you might not need that body hook:

Harlem is basically adding <script>window.__harlemState = state</script> to the DOM, which overlaps with the role of Vite SSR (serializing state as well).
You can use the new state transformer hook (more docs in readme) to move Harlem's state to Vite SSR initial state:

function transformState(state) {
  if (import.meta.env.SSR) {
    state.harlem = getHarlemState()
    return JSON.stringify(state)
  } else {
    // Restore Harlem's state to its place
    window.__harlemState = JSON.parse(state.harlem)
    return state
  }
}

The problem is that they don't provide a "getHarlemState" function out of the box but it can be easily done by using another function they provide:

function getHarlemState() {
  const script = getBridgingScript()
  return script.slice(script.indexOf('=') + 1)
}

It would be nice if they provide getState and setState directly so it can be integrated with other tools easily. Maybe they would be open for a PR?

Tell me if this works for you (the transformState hook is implemented in 0.6.8).

[yaquawa]

Good to know that, thanks for the detail!

Also I've noticed that I could just write a little plugin for this using the transformIndexHtml hook.