How to Resolve "Parsing error: This experimental syntax requires enabling one of the following parser plugin(s): 'jsx, flow, typescript'" in Vue SFC - babeljs

Question

I'm getting this strange error with eslint inside of a Vue SFC template.
Parsing error: This experimental syntax requires enabling one of the following parser plugin(s): 'jsx, flow, typescript' (1:0) (Which appears to be throwing on the opening tag of the Vue SFC <template> tag.)
Here's the Vue SFC (literally the stock Vite App.vue file)
<template>
<img
alt="Vue logo"
src="./assets/logo.png"
>
<HelloWorld
msg="Hello Vue 3 + Vite"
/>
</template>
Here's my .eslintrc file
module.exports = {
env: {
browser: true,
es2021: true,
},
extends: [
'plugin:vue/essential',
'airbnb-base',
],
parser: '#babel/eslint-parser',
parserOptions: {
ecmaVersion: 12,
requireConfigFile: false,
sourceType: 'module',
},
plugins: [
'vue',
],
rules: {
'import/no-extraneous-dependencies': ['error', { devDependencies: true }],
'vue/no-multiple-template-root': 'off',
},
};
And my package.json in case it's relevant
{
"version": "0.0.0",
"scripts": {
"build": "vite build",
"dev": "vite",
"lint": "eslint **/*.{js,vue}",
"serve": "vite preview"
},
"dependencies": {
"ky": "^0.28.5",
"vue": "^3.0.5"
},
"devDependencies": {
"#babel/core": "^7.15.0",
"#babel/eslint-parser": "^7.15.0",
"#vitejs/plugin-vue": "^1.2.3",
"#vue/compiler-sfc": "^3.0.5",
"eslint": "^7.32.0",
"eslint-config-airbnb-base": "^14.2.1",
"eslint-plugin-import": "^2.24.2",
"eslint-plugin-vue": "^7.17.0",
"jest": "^27.1.0",
"vite": "^2.3.7"
}
}
I'm not really sure what would cause this since I have
extends: [
'plugin:vue/essential',
'airbnb-base',
],
and
plugins: [
'vue',
],
within .eslintrc.
I'd like to know how to resolve this, but I would also like to understand what's going on here to cause this error to be thrown in the first place.

Answer 1

The issue was being caused by this within .eslintrc
parser: '#babel/eslint-parser',
parserOptions: {
ecmaVersion: 12,
requireConfigFile: false,
sourceType: 'module',
},
It should instead be
parserOptions: {
ecmaVersion: 12,
parser: '#babel/eslint-parser',
requireConfigFile: false,
sourceType: 'module',
},
The parser property isn't even mentioned within https://eslint.org/docs/user-guide/configuring/language-options#specifying-parser-options so it might just be outdated at this point.