我的 Vue SPA 的 linting 有问题。我正在使用脚本设置语法糖 (https://v3.vuejs.org/api/sfc-script-setup.html) 中的 defineEmits 函数。这些错误没有任何意义,有没有人知道如何解决这个问题(无需为受影响的文件禁用这些规则,因为每次使用 defineEmits 都会发生这种情况)。奇怪的是,defineProps 函数没有错误,遵循相同的语法。有谁可以帮我离开这里吗?
我的 linter 提示这些错误:
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
生成这些错误的代码(defineEmits 是所有错误的来源:<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>
我的 linting eslintrs.js 文件(导入的共享规则不会修改 eslint 提示的规则):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',
},
}
更新:我做了一些进一步的挖掘,看到了这种情况:
type EmitsType = {
(e: 'update:modelValue', value: string): void
}
const emit = defineEmits<EmitsType>()
使用以下 linting 输出:23:3 error 'e' is defined but never used no-unused-vars
23:27 error 'value' is defined but never used no-unused-vars
似乎 linter 无法正确处理这些类型。
最佳答案
我有同样的问题,我找到了 2 个解决方案,它解决了这个问题,但我不太确定我是否做错了。
'@typescript-eslint/recommended'
给您的eslintrc
plugins: [
...,
'@typescript-eslint/recommended',
],
或者'func-call-spacing'
规则 rules: {
...
'func-call-spacing': 'off', // Fix for 'defineEmits'
}
以下是有关 no-unused-vars
的更多详细信息.https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/docs/rules/no-unused-vars.md
关于javascript - defineEmits 函数的 Vue linting 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70803374/