Quasar v2 ssr mode and apollo extension

[ipalestine]

What happened?

When run:

quasar ext add @quasar/apollo@next

The @vue/apollo-composable is not installed automatically and after i manually install it, when run:

quasar dev -m ssr

This error is printed in the console:

۲۰:۳۱:۳۴ [vite] Error when evaluating SSR module /src/boot/apollo.js: Error [ERR_REQUIRE_ESM]: require() of ES Module E:\client\node_modules\@apollo\client\core\index.js from E:\client\node_modules\@vue\apollo-composable\dist\index.js not supported. Instead change the require of E:\client\node_modules\@apollo\client\core\index.js in E:\client\node_modules\@vue\apollo-composable\dist\index.js to a dynamic import() which is available in all CommonJS modules. at Object. (E:\client\node_modules\@vue\apollo-composable\dist\index.js:250:30) at async Promise.all (index 0) at async nodeImport (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50387:21) at async eval (/src/boot/apollo.js:5:31) at async instantiateModule (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50317:9) E:\client\node_modules\@vue\apollo-composable\dist\index.js:250 var import_core = __toModule(require("@apollo/client/core/index.js")); ^

Error [ERR_REQUIRE_ESM]: require() of ES Module E:\client\node_modules\@apollo\client\core\index.js from E:\client\node_modules\@vue\apollo-composable\dist\index.js not supported. Instead change the require of E:\client\node_modules\@apollo\client\core\index.js in E:\client\node_modules\@vue\apollo-composable\dist\index.js to a dynamic import() which is available in all CommonJS modules. at Object. (E:\client\node_modules\@vue\apollo-composable\dist\index.js:250:30) at async Promise.all (index 0) at async nodeImport (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50387:21) at async eval (/src/boot/apollo.js:5:31) at async instantiateModule (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50317:9) { code: 'ERR_REQUIRE_ESM' }

• this work correctlly in spa mode

What did you expect to happen?

Project run correctly in ssr mode

Reproduction URL

https://github.com/ipalestine/q-apollo-ssr.git

How to reproduce?

clone github repository run npm install quasar dev -m ssr See error

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Quasar CLI Commands/Configuration (@quasar/cli - @quasar/app-vite), Quasar Extras (@quasar/extras), SSR Mode

Platforms/Browsers

Firefox

Quasar info output

Operating System - Windows_NT(10.0.19045) - win32/x64
NodeJs - 16.15.1

Global packages
  NPM - 8.11.0
  yarn - Not installed
  @quasar/cli - 2.2.1
  @quasar/icongenie - Not installed
  cordova - 11.1.0

Important local packages
  quasar - 2.12.0 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 1.4.3 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.16.4 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.3.4 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.2.2
  pinia - 2.1.3 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  vite - 2.9.16 -- Native-ESM powered web dev build tool
  eslint - 8.41.0 -- An AST-based pattern checker for JavaScript.
  electron - Not installed
  electron-builder - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  @quasar/quasar-app-extension-apollo - 2.0.0-beta.5 -- A Quasar app extension to add GraphQL support using Apollo Client.

Networking
  Host - RASAP
  Ethernet - 192.168.1.100

Relevant log output

۲۰:۳۱:۳۴ [vite] Error when evaluating SSR module /src/boot/apollo.js:
Error [ERR_REQUIRE_ESM]: require() of ES Module E:\client\node_modules\@apollo\client\core\index.js from E:\client\node_modules\@vue\apollo-composable\dist\index.js 
not supported.
Instead change the require of E:\client\node_modules\@apollo\client\core\index.js in E:\client\node_modules\@vue\apollo-composable\dist\index.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (E:\client\node_modules\@vue\apollo-composable\dist\index.js:250:30)
    at async Promise.all (index 0)
    at async nodeImport (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50387:21)
    at async eval (/src/boot/apollo.js:5:31)
    at async instantiateModule (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50317:9)
var import_core = __toModule(require("@apollo/client/core/index.js"));
                             ^

Error [ERR_REQUIRE_ESM]: require() of ES Module E:\client\node_modules\@apollo\client\core\index.js from E:\client\node_modules\@vue\apollo-composable\dist\index.js 
not supported.
Instead change the require of E:\client\node_modules\@apollo\client\core\index.js in E:\client\node_modules\@vue\apollo-composable\dist\index.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (E:\client\node_modules\@vue\apollo-composable\dist\index.js:250:30)
    at async Promise.all (index 0)
    at async nodeImport (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50387:21)
    at async eval (/src/boot/apollo.js:5:31)
    at async instantiateModule (E:\client\node_modules\vite\dist\node\chunks\dep-6e2fe41e.js:50317:9) {
  code: 'ERR_REQUIRE_ESM'
}

Additional context

No response

[dkrystki]

Any updates on this? I'm also having this issue.

[smolinari]

Sorry for the late reply. This is an upstream issue, which we can't resolve here. It's one of those "switching to ESM" woes we'll be experiencing in the next year or two. I'm closing this as "can't fix" for now. Hopefully it will resolve itself sooner than later.

Scott

[smolinari]

There is a sort of rough workaround. Not completely working yet, but I have tested the new 2.0(alpha) app/vite with the new AE and it compiles (after getting around a couple of issues). So, the good news is, when the new version arrives, it will help fix this problem.

Scott