bodyHtmlEnd

Environment: server.
Implemented by: vike-vue.

You need vike-vue to be able to use bodyHtmlEnd.

Setting to insert HTML at the end of the <body> tag. See also bodyHtmlBegin.

It's usually used for adding the HTML targets of teleports.

Teleports work out of the box when using <Teleport to="teleported"> and you don't have to use bodyHtml{Begin,End} then.

vike-vue always inserts this at the end of the <body> tag:

<div id="teleported">${
  pageContext.ssrContext.teleports?.['#teleported'] ?? ''
}</div>

You can use Vike's pageContext object to access Vue's ssrContext object:

// pages/+bodyHtmlEnd.js
 
export default (pageContext) => {
  const content = pageContext.ssrContext.teleports?.['#someTeleport'] ?? ''
  return `<div id="someTeleport">${content}</div>`
}

See also