eslint-plugin-vue
eslint-plugin-vue copied to clipboard
`vue/define-macros-order` false positive with using `export`
vue/define-macros-order
produces an error every time I'm trying to add an export
to Props
. Exporting props is one of the ways how to use TypeScript with Vue.
It looks like the rule doesn't handle type definitions as type definitions in case we're trying to export them. 🤔
Tell us about your environment
- ESLint version: 8.23.1
- eslint-plugin-vue version: 9.5.1
- Node version: 18.8.0
- Operating System: Mac OS
Please show your full configuration:
{
"parserOptions": {
"parser": "@typescript-eslint/parser",
"extraFileExtensions": [".vue"]
},
"extends": ["plugin:vue/base"],
"rules": {
"vue/define-macros-order": "error"
}
}
What did you do?
<script setup lang="ts">
export interface Props {}
defineProps<Props>();
</script>
What did you expect to happen?
No error was produced.
What actually happened?
/private/tmp/eslint-vue-define-macros-order-bug/App.vue
4:3 error defineProps should be the first statement in `<script setup>` (after any potential import statements or type definitions) vue/define-macros-order
✖ 1 problem (1 error, 0 warnings)
1 error and 0 warnings potentially fixable with the `--fix` option.
Repository to reproduce this issue
https://github.com/Ky6uk/eslint-vue-define-macros-order-bug
Indeed, it looks like type definitions that are exported will erroneously be reported as errors. A pull request to fix this is welcome :slightly_smiling_face:
Please also add a test case (and maybe a fix) for export interface Foo {}
.
@Ky6uk Note that in your case, you probably don't need to export the type definition. Just declaring it should probably also work fine, and should not cause this issue.
@FloEdelmann yep, it's not a blocker for sure. Unfortunately, there's another issue related to Volar in case the export is omitted. ¯\(ツ)/¯
@FloEdelmann just to note that I've tested it and it looks like this bug has been fixed in the v9.8.0
. At least I can't reproduce it anymore since v9.8.0
. 🤔