Erroneous `padded-blocks` violation triggered by a comment inside a function
Closed this issue · 2 comments
Checklist
- I have tried restarting my IDE and the issue persists.
- I have read the FAQ and my problem is not listed.
Tell us about your environment
- ESLint version:
8.57.0,9.29.0 - eslint-plugin-vue version:
9.33.0,10.2.0 - Vue version:
3.5.16 - Node version:
20.19.1,22.12.0 - Operating System: macOS / StackBlitz
Please show your full configuration:
import pluginVue from 'eslint-plugin-vue'
import stylistic from '@stylistic/eslint-plugin'
import {
defineConfigWithVueTs,
vueTsConfigs,
} from '@vue/eslint-config-typescript'
export default defineConfigWithVueTs(
pluginVue.configs['flat/essential'],
vueTsConfigs.recommendedTypeChecked,
{
plugins: {
'@stylistic': stylistic,
},
rules: {
'@stylistic/padded-blocks': ['error', 'never'],
'@stylistic/semi': ['error', 'never'],
'no-console': ['error'],
},
},
)What did you do?
<script lang="ts" setup>
const test = () => {
// eslint-disable-next-line no-console
console.log('hello')
}
</script>
<script lang="ts">
/**
* This docstring causes the padded-blocks rules to trigger on line 2 above.
*/
export default {}
</script>
<template>
<div @click="test" />
</template>What did you expect to happen?
I expected there to be no lint violations.
What actually happened?
/home/projects/stackblitz-starters-gaeg8amk/FailComponent.vue
2:20 error Block must not be padded by blank lines @stylistic/padded-blocks
✖ 1 problem (1 error, 0 warnings)
1 error and 0 warnings potentially fixable with the `--fix` option.
Repository to reproduce this issue
https://stackblitz.com/edit/stackblitz-starters-gaeg8amk?file=PassComponent.vue,FailComponent.vue
This isn't reported by a vue-eslint-plugin rule.
You might want to open an issue in the eslint-stylistic repository instead.
After looking into it further, it seems to be an issue with vue-eslint-parser. The comments array is parsed in a different order—script comes before script setup, which doesn't match the user's definition. See PassingComponent and FailComponent.
As a temporary workaround, you can swap the order of the two <script> blocks. I'll investigate further and open an issue in the vue-eslint-parser repository to track this.