vuejs / eslint-plugin-vue

Official ESLint plugin for Vue.js
https://eslint.vuejs.org/
MIT License
4.41k stars 659 forks source link

`vue/no-shadow` false positive in double script block #1800

Open sqal opened 2 years ago

sqal commented 2 years ago

Checklist

Tell us about your environment

Please show your full configuration:

module.exports = {
  extends: [
    'plugin:vue/vue3-recommended',
  ],
  rules: {
    'no-shadow': 'error',
  },
};

What did you do?

<script>
  export function useModal() {
    const close = () => {}

    return { close }
  }
</script>

<script setup>
  function close() {

  }
</script>

<template>
  <Modal @close="close"></Modal>
</template>

What did you expect to happen? No errors reported for the no-shadow rule.

What actually happened?

[3:11]: 'close' is already declared in the upper scope on line 10 column 12. (no-shadow)

Repository to reproduce this issue

Online Playground

FloEdelmann commented 1 year ago

Another repository to reproduce this issue was provided in #2141: https://github.com/teleskop150750/vue-no-shadow

FloEdelmann commented 1 year ago

In Vue 3.3, you can now use defineOptions in <script setup> and avoid this issue altogether, see https://blog.vuejs.org/posts/vue-3-3#defineoptions and https://vuejs.org/api/sfc-script-setup.html#defineoptions.