Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

203
Vistas
Vue linting errors for defineEmits function

I'm having an issue with the linting for my Vue SPA. I'm using the defineEmits function from the script setup syntactic sugar (https://v3.vuejs.org/api/sfc-script-setup.html). The errors just do not make any sense, does anyone know how to fix this (without disabling these rules for the affected files, because it happens to every usage of defineEmits). The weird thing is that the defineProps function works without errors, which follows the same syntax. Can anyone help me out here?

My linter complains about these errors:

22:14  error  Unexpected space between function name and paren       no-spaced-func
22:27  error  Unexpected whitespace between function name and paren  func-call-spacing
23:3   error  'e' is defined but never used                          no-unused-vars
23:27  error  'value' is defined but never used                      no-unused-vars

Code that is generating these errors (the defineEmits is the source of all the errors:

<script lang="ts" setup>
const emit = defineEmits<{
    (e: 'update:modelValue', value: string): void
}>()

defineProps<{
    modelValue: string
    name: string
    items: string[]
}>()

const onInput = (e: Event) => {
    emit('update:modelValue', (e.target as HTMLInputElement).value)
}
</script>

My linting eslintrs.js file (the imported shared rules do not modify the rules eslint is complaining about):

const path = require('path')

const prettierSharedConfig = require(path.join(__dirname, '../prettier-shared-config.json'))

module.exports = {
    settings: {
        'import/resolver': {
            typescript: {},
            node: {
                extensions: ['.js', '.ts', '.vue'],
            },
        },
    },
    env: {
        browser: true,
        es2021: true,
        'vue/setup-compiler-macros': true,
    },
    extends: ['plugin:vue/essential', 'airbnb-base'],
    parserOptions: {
        ecmaVersion: 13,
        parser: '@typescript-eslint/parser',
        sourceType: 'module',
    },
    plugins: ['vue', '@typescript-eslint'],
    rules: {
        ...prettierSharedConfig.rules.shared,
        'vue/multi-word-component-names': 'off',
        'vue/no-multiple-template-root': 'off',
    },
}

Update:

I did some further digging and saw this happening:

type EmitsType = {
    (e: 'update:modelValue', value: string): void
}

const emit = defineEmits<EmitsType>()

With the following linting output:

23:3   error  'e' is defined but never used      no-unused-vars
23:27  error  'value' is defined but never used  no-unused-vars

It seems that the linter cannot properly process these types.

over 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

I did not find an ideal answer, but my current workaround is to use a different defineEmits syntax.

defineEmits(['update:modelValue'])

The downside of this is does not type the emit parameter value, but I could not find another way to make it work.

over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda