Subscribe on changes!

[Server Renderer] Global context is limited to module scope, causing mysterious build issues.

avatar
Feb 18th 2022

Version

3.2.31

Steps to reproduce

The renderToString function in @vue/server-renderer takes a context argument that is shared between modules in a global fashion (not imported explicitly)

    const ctx  = {} // this will be attached to module scope and shared between components
    out.appHtml = await renderToString(app, ctx)

However, this global appears to be attached to the renderer module itself. Normally this is fine, but occasionally we do more creative things with modules like link them from another location.

This causes a mismatch between the modules used by the renderer and those used by the app. When building the app in this situation, the errors generated are mysterious and it took me a while to understand the issue:

[Vue warn]: Server rendering context not provided. Make sure to only call useSSRContext() conditionally in the server build.
[Vue warn]: Unhandled error during execution of setup function

 ERROR  Cannot read properties of undefined (reading 'modules')

I suggest one of two solutions:

  • Change the context scope to an actual Node global global.ssrContext which would work the same across the system
  • If thats not viable, improve the error message to explain that context is in the module scope and that the error may be related to the posture of your dependencies

What is expected?

No build error related to module location

What is actually happening?

Build errors

avatar
Feb 18th 2022

This sounds more like the common identity hazard arising when linking a package locally.

Vue relies on singletons in a couple of places, like the effects scheduler, so this is not really limited to SSR.

The proper solution is to make sure in your build tooling that all imports of Vue point to a single physical package.

In Vite, out can use the dedupe option for this. In webpack, you can add an alias for Vue resolving to an absolute path.

In lieu of a reproduction this is as far as I can help you here.

avatar
Feb 18th 2022

Thanks, I didn't know about the Vite "dedupe" option (although it still wont work for me since we are using ES builds)...

I would still recommend an improvement to the error message; as these types of issues are tough to debug.

On Fri, Feb 18, 2022 at 10:50 AM Thorsten Lünborg @.***> wrote:

Closed #5455 https://github.com/vuejs/core/issues/5455.

— Reply to this email directly, view it on GitHub https://github.com/vuejs/core/issues/5455#event-6101223431, or unsubscribe https://github.com/notifications/unsubscribe-auth/AACLHJR7PZCMNDZNCGVO47DU32BGTANCNFSM5OYLIUFA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

You are receiving this because you authored the thread.Message ID: @.***>