nuxt / eslint

Collection of ESLint-related packages for Nuxt
https://eslint.nuxt.com
MIT License
555 stars 66 forks source link

Parsing error: Unexpected token : #490

Closed ProxBoss closed 2 months ago

ProxBoss commented 2 months ago

Environment

------------------------------
- Operating System: Linux
- Node Version:     v22.5.1
- Nuxt Version:     3.13.0
- CLI Version:      3.13.1
- Nitro Version:    2.9.7
- Package Manager:  pnpm@9.9.0
- Builder:          -
- User Config:      compatibilityDate, devtools, extends, modules, sourcemap, pinia, eslint
- Runtime Modules:  @nuxt/eslint@0.5.3, @nuxt/ui, @nuxt/icon@1.5.0, @nuxtjs/tailwindcss@6.12.1, @pinia/nuxt@0.5.4, @pinia-plugin-persistedstate/nuxt@1.2.1
- Build Modules:    -
------------------------------

Package

@nuxt/eslint

Reproduction

I'm relativly new to Typescript and vue/nuxt, but I'm fairly certain this is valid syntax and code...

I keep getting "error Parsing error: Unexpected token :" pointing to the colin before the type specifier in the function parameter list.

Minimal Example Component

<!-- ./component/SettingsButton.vue -->
<script lang="ts" setup>
function clickHandler(event: PointerEvent) {
  console.log(event);
}
</script>

<template>
  <ClientOnly>
    <UButton
      icon="i-heroicons-cog-6-tooth-20-solid"
      color="gray"
      variant="ghost"
      aria-label="Messages"
      @click="clickHandler"
    />
    <template #fallback>
      <div class="w-8 h-8" />
    </template>
  </ClientOnly>
</template>

<style></style>

eslint Result

node ➜ /workspaces/Notifier (Spike) $ eslint ./components/SettingsButton.vue 

/workspaces/Notifier/components/SettingsButton.vue
  3:27  error  Parsing error: Unexpected token :
✖ 1 problem (1 error, 0 warnings)

Describe the bug

eslint with the @nuxt/eslint module is incorrectly flagging ":" in function parameter lists as a parse error when used in a vue component.

e.g. the colon in the function declaration below would trigger a parse error is used in a Vue component Githubissues.

  • Githubissues is a development platform for aggregating issues.