Vitest error SyntaxError: At least one <template> or <script> is required in a single file component

Question

I am using Vitest for Vue Unit Testing and I am currently faced with this error:

FAIL  tests/unit/components/MyComponent.spec.js [ tests/unit/components/MyComponent.spec.js ]
SyntaxError: At least one <template> or <script> is required in a single file component.

My unit test is complaining that there is no <template> and <script> but I most certainly have those tags because I am able to display the web page and I have checked my components. The issue might be my vitest.config.js file as shown below:

export default mergeConfig(
  viteConfig,
  defineConfig({
    plugins: [Vue()],
    test: {
      globals: true,
      environment: 'jsdom',
      exclude: [...configDefaults.exclude, 'e2e/*', 'packages/template/*'],
      root: fileURLToPath(new URL('./', import.meta.url)),
      transformMode: {
        web: [/\.[jt]sx$/]
      }
    },
    root: '.'
  })
)

Update

I found a temporary fix and that is to remove Vue() in the plugins.

export default mergeConfig(
  viteConfig,
  defineConfig({
    plugins: [], // remove Vue()
    test: {
      globals: true,
      environment: 'jsdom',
      exclude: [...configDefaults.exclude, 'e2e/*', 'packages/template/*'],
      root: fileURLToPath(new URL('./', import.meta.url)),
      transformMode: {
        web: [/\.[jt]sx$/]
      }
    },
    root: '.'
  })
)

Transeunt

Thank you - this was super helpful. It looks like the vue plugin is no longer needed in the vitest config. – Electroacoustics

This temporary fix update should perhaps be an accepted answer. Fixed things for me. – Jonson

Fixed also for me. Removing Vue in plugin section of vitest.config.js fixes the issue. – Tabret

Fixed for me as well. – Commando