Vitest: Unexpected token 'export'

[golubeva-webmaster]

Version

^5.4.3

Link to Minimal Reproduction

Visual Studio Code

Steps to Reproduce

Good time! Guys, importing charts "knocks down" tests written on vitest:
SyntaxError: Unexpected token 'export'

Although the recommended setting is written in my config...

//vitest.config.ts
/// <reference types="vitest/config" />
import { defineConfig, mergeConfig } from "vitest/config"
// import { mergeConfig } from "vitest/config"
// import { defineConfig } from "vite"
import vue from "@vitejs/plugin-vue"
import { quasar, transformAssetUrls } from "@quasar/vite-plugin"
import path from "path"
import { Panel } from "@stereotech/cloud-components"

export default mergeConfig(
  {
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "./src"),
      },
    },
    plugins: [
      vue({
        template: {
          compilerOptions: {
            isCustomElement: (tag) => ["panel1"].includes(tag),
          },
          transformAssetUrls,
        },
      }),
      quasar(),
    ],
  },
  defineConfig({
    test: {
      globals: true, //& Чтобы не импортировать expect, describe, it в каждом тесте
      environment: "jsdom",
      coverage: {
        provider: "v8",
      },
      server: {
        deps: {
          inline: ["echarts"],
        },
      },
      // environmentMatchGlobs: [["tests/components/**", "jsdom"]],
    },
    // plugins: [svelte({ hot: !process.env.VITEST })],
  }),
)

//vite.config.ts
import { defineConfig, loadEnv, UserConfig } from "vite"
import vue from "@vitejs/plugin-vue"
import { quasar, transformAssetUrls } from "@quasar/vite-plugin"
import electron from "vite-plugin-electron/simple"
import path from "path"

const webConfig: UserConfig = {
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
  plugins: [
    vue({
      template: { transformAssetUrls },
    }),
    quasar(),
  ],
}

const panelConfig: UserConfig = {
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
  plugins: [
    vue({
      template: { transformAssetUrls },
    }),
    quasar(),

    electron({
      main: {
        entry: "electron/main.ts",
      },
      preload: {
        input: "electron/preload.ts",
      },
      renderer: {},
    }),
  ],
}

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd(), "")
  if (env.VITE_APP_PLATFORM === "panel" && mode === "production") {
    //Electron build
    return panelConfig
  } else {
    return webConfig
  }
})

Current Behavior

Module C:/WorkProjects/Ste-App-Client-2/node_modules/echarts/core.js:20 seems to be an ES Module but shipped in a CommonJS package. You might want to create an issue to the package "echarts" asking them to ship the file in .mjs extension or add "type": "module" in their package.json.

As a temporary workaround you can try to inline the package by updating your config:

// vitest.config.js
export default {
test: {
server: {
deps: {
inline: [
"echarts"
]
}
}
}
}

Expected Behavior

No errors

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response