"Unexpected token 'export'" when importing @quasar/extras with @quasar/app-vite in SSR mode

What happened?

in SSR mode : SyntaxError(500) Unexpected token ‘export’

What did you expect to happen?

No error.

Reproduction URL

https://github.com/Dodobibi/QuasarViteSsrRepro

How to reproduce?

npm create quasar (With TS & Vite) quasar mode add ssr

Add an Icon from @quasar/extras in App.vue:

<template>
  <q-btn color="primary" :icon="mdiMenu" label="OK" />
  <router-view />
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import { mdiMenu } from '@quasar/extras/mdi-v6';

export default defineComponent({
  name: 'App',
  setup() {
    return {
      mdiMenu,
    };
  },
});
</script>

quasar dev -m ssr

Flavour

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

Areas

Quasar Extras (@quasar/extras), SSR Mode

Platforms/Browsers

Chrome, Microsoft Edge

Quasar info output

Operating System - Windows_NT(10.0.19044) - win32/x64
NodeJs - 16.13.0

Global packages
  NPM - 8.1.0
  yarn - 1.22.15
  @quasar/cli - undefined
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.6.0 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 1.0.0-beta.3 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.13.0 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.2.31 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.0.14
  pinia - Not installed
  vuex - Not installed
  vite - 2.8.6 -- Native-ESM powered web dev build tool
  eslint - 8.11.0 -- An AST-based pattern checker for JavaScript.
  electron - Not installed
  electron-packager - 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
  *None installed*

Relevant log output

Error when evaluating SSR module /src/App.vue:
C:\PROJETS\TESTQ\node_modules\.pnpm\@quasar+extras@1.13.0\node_modules\@quasar\extras\mdi-v6\index.js:3
export const mdiAbTesting = 'M4 2A2 2 0 0 0 2 4V12H4V8H6V12H8V4A2 2 0 0 0 6 2H4M4 4H6V6H4M22 15.5V14A2 2 0 0 0 20 12H16V22H20A2 2 0 0 0 22 20V18.5A1.54 1.54 0 0 0 20.5 17A1.54 1.54 0 0 0 22 15.5M20 20H18V18H20V20M20 16H18V14H20M5.79 21.61L4.21 20.39L18.21 2.39L19.79 3.61Z'
^^^^^^

SyntaxError: Unexpected token 'export'
    at compileFunction (<anonymous>)
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1031:15)
    at Module._compile (node:internal/modules/cjs/loader:1065:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:190:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:185:25)
    at async Promise.all (index 0)
17:54:46 [vite] Error when evaluating SSR module /.quasar/app.js:
C:\PROJETS\TESTQ\node_modules\.pnpm\@quasar+extras@1.13.0\node_modules\@quasar\extras\mdi-v6\index.js:3
export const mdiAbTesting = 'M4 2A2 2 0 0 0 2 4V12H4V8H6V12H8V4A2 2 0 0 0 6 2H4M4 4H6V6H4M22 15.5V14A2 2 0 0 0 20 12H16V22H20A2 2 0 0 0 22 20V18.5A1.54 1.54 0 0 0 20.5 17A1.54 1.54 0 0 0 22 15.5M20 20H18V18H20V20M20 16H18V14H20M5.79 21.61L4.21 20.39L18.21 2.39L19.79 3.61Z'
^^^^^^

SyntaxError: Unexpected token 'export'
    at compileFunction (<anonymous>)
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1031:15)
    at Module._compile (node:internal/modules/cjs/loader:1065:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:190:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:185:25)
    at async Promise.all (index 0)
17:54:46 [vite] Error when evaluating SSR module C:\PROJETS\TESTQ\.quasar\server-entry.js:
C:\PROJETS\TESTQ\node_modules\.pnpm\@quasar+extras@1.13.0\node_modules\@quasar\extras\mdi-v6\index.js:3
export const mdiAbTesting = 'M4 2A2 2 0 0 0 2 4V12H4V8H6V12H8V4A2 2 0 0 0 6 2H4M4 4H6V6H4M22 15.5V14A2 2 0 0 0 20 12H16V22H20A2 2 0 0 0 22 20V18.5A1.54 1.54 0 0 0 20.5 17A1.54 1.54 0 0 0 22 15.5M20 20H18V18H20V20M20 16H18V14H20M5.79 21.61L4.21 20.39L18.21 2.39L19.79 3.61Z'
^^^^^^

SyntaxError: Unexpected token 'export'
    at compileFunction (<anonymous>)
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1031:15)
    at Module._compile (node:internal/modules/cjs/loader:1065:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:190:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:185:25)
    at async Promise.all (index 0)

Additional context

Using pnpm, but same issue with yarn.

[rstoenescu]

Yes. Working on it. Will push a fix later this evening.

[rstoenescu]

Fixes will be available through Quasar v2.6.1 and q/extras 1.13.2 Also make sure that you stay on latest q/app-vite beta.