VueJS and ESlint (prettier) parsing error "adjacent JSX elements must be wrapped in an enclosing parent tag" - vue.js

Question

I've got a problem with my linter/prettier in VueJS. In every .vue file there is a parsing error (showing up at the <script> or <style> tag after the <template> ... </template>)
error Parsing error: Unexpected token <. Remember, adjacent JSX elements must be wrapped in an enclosing parent tag prettier/prettier
I tried configuring the .eslintrc but the error is still showing up
require('#rushstack/eslint-patch/modern-module-resolution')
module.exports = {
root: true,
env: {
es6: true,
node: true
},
extends: [
'plugin:vue/vue3-essential',
'eslint:recommended',
'#vue/eslint-config-typescript',
'#vue/eslint-config-prettier',
],
parser: 'vue-eslint-parser',
parserOptions: {
ecmaVersion: 'latest',
parser: '#typescript-eslint/parser',
sourceType: 'module',
},
rules: {
'vue/multi-word-component-names': 0,
},
}
Hope someone has an idea, cause it's driving me crazy...

Answer 1

I solved it by adding extends: [ 'vue', 'standard' ] to the .eslintrc so it now looks like this
require('#rushstack/eslint-patch/modern-module-resolution')
module.exports = {
root: true,
env: { es6: true, node: true },
extends: [
'vue',
'standard',
'plugin:vue/vue3-essential',
'eslint:recommended',
'#vue/eslint-config-typescript',
'#vue/eslint-config-prettier',
],
parser: 'vue-eslint-parser',
parserOptions: {
ecmaVersion: 'latest',
parser: '#typescript-eslint/parser',
sourceType: 'module',
},
rules: {
'vue/multi-word-component-names': 0,
},
}