I keep on getting strange linting errors when trying to lint a .vue file. In the following file I get this error. I am using the antfu default linter as it was recommended by a lot of people online as a good default set of rules. I am not sure if this has anything to do with it. In a nutshell, ESLint is simply not set up to parse <script setup lang="ts"> blocks as TypeScript code.

Parsing error: Unexpected token ]eslint

This is my index.vue file inside my /pages folder:

<script setup lang="ts">
import Quiz from '~/components/quiz/Quiz.vue'

const answers = ref<string[]>([
  'Vincent van Gogh',
  'Pablo Picasso',
  'Leonardo da Vinci',
  'Michelangelo',
])

const selectedAnswer = ref<string | null>(null)
function setSelectedAnswer(answer: string) {
  selectedAnswer.value = answer
}
</script>

<template>
  <Quiz />
</template>

This is my eslint.config.mjs:

import antfu from '@antfu/eslint-config'

export default antfu()

This is my package.json:

{
  "name": "nuxt-app",
  "type": "module",
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare",
    "lint": "eslint",
    "lint:fix": "eslint --fix",
    "db:generate": "drizzle-kit generate",
    "db:migrate": "drizzle-kit migrate",
    "seed:nuxt": "nuxi seed"
  },
  "dependencies": {
    "@aws-sdk/client-s3": "^3.775.0",
    "@aws-sdk/s3-request-presigner": "^3.777.0",
    "@nuxt/devtools": "^2.3.2",
    "@nuxt/eslint": "^1.2.0",
    "csv-parser": "^3.2.0",
    "drizzle-orm": "^0.41.0",
    "nuxt": "^3.16.1",
    "pg": "^8.14.1",
    "vite": "^6.2.3",
    "vue": "^3.5.13",
    "vue-router": "^4.5.0",
    "vuetify-nuxt-module": "^0.18.4"
  },
  "devDependencies": {
    "@antfu/eslint-config": "^4.11.0",
    "@types/pg": "^8.11.11",
    "drizzle-kit": "^0.30.5",
    "eslint": "^9.23.0"
  }
}

I have tried to refresh my lint setup by removing the packages and reinstalling it npx nuxi module add eslint. But then still I keep on getting this error. My eslint config then looks as follow:

import withNuxt from './.nuxt/eslint.config.mjs'

export default withNuxt()

Even then I get the following error for a simple example:

Parsing error: Unexpected token :eslint

<script setup lang="ts">
const test: string = 'test'
</script>

<template>
  <div />
</template>