Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[ssr] Support module information collection #56

Open
lzxb opened this issue Oct 11, 2022 · 1 comment
Open

[ssr] Support module information collection #56

lzxb opened this issue Oct 11, 2022 · 1 comment

Comments

@lzxb
Copy link

lzxb commented Oct 11, 2022

Module information can be collected like Vue3

export async function render(url, manifest) {
  const { app, router } = createApp()

  // set the router to the desired URL before rendering
  await router.push(url)
  await router.isReady()

  // passing SSR context object which will be available via useSSRContext()
  // @vitejs/plugin-vue injects code into a component's setup() that registers
  // itself on ctx.modules. After the render, ctx.modules would contain all the
  // components that have been instantiated during this render call.
  const ctx = {}
  const html = await renderToString(app, ctx)

  // the SSR manifest generated by Vite contains module -> chunk/asset mapping
  // which we can then use to determine what files need to be preloaded for this
  // request.
  const preloadLinks = renderPreloadLinks(ctx.modules, manifest)
  return [html, preloadLinks]
}
@lwansbrough
Copy link

This is pretty high importance if I'm understanding correctly. Currently we're seeing a FOUC because Vite isn't including the chunks from these modules in the SSR render. As a result, our styles aren't loading until the JS app has fully hydrated. We obviously can't bring that to production. @yyx990803 Could you comment on the feasibility of adding that ctx.modules populating functionality to this plugin?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants