Vue 3: Erro na criação "Identificador esperado, mas encontrado 'import'" [duplicado]

Estou tentando criar um novo aplicativo vue 3, mas tenho um problema com a criação.

Versão do nó: 22.10.0 Versão do Npm: 10.9.0

Eu crio meu projeto com: npm create vue@latest como na documentação

E quando tento executar o código comnpm run dev

Eu recebi esse erro

X [ERROR] Expected identifier but found "import"

    (define name):1:0:
      1 │ import.meta.url
        ╵ ~~~~~~

failed to load config from C:\Apache24\htdocs\testvue3\vite.config.mjs
error when starting dev server:
Error: Build failed with 3 errors:
(define name):1:0: ERROR: Expected identifier but found "import"

Ainda não toquei em nenhuma linha de código e o problema parece vir do arquivo vite.config.ts abaixo

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueDevTools(),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    },
  },
})