[Vuejs]-'props' is assigned a value but never used no-unused-vars vue3

0👍

When you add <script setup> to the Vue File, Vue adds some sugar to the code.

One example is defineProps.

  • You don’t need to import defineProps
  • You can easily remove the const props =
<template>
    <router-link :to="{ name: routerName }" type="is-primary"
        class="inline-flex justify-center py-2 px-3 mb-3 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
        </svg>&nbsp;Cancel
    </router-link>
</template>

<script setup>
defineProps({
  routerName: {
    type: String,
    required: true,
  },
});
</script>

P. S. You can also remove "vue/script-setup-uses-vars" when using vue-eslint-parser v9.0.0 or later. Source

-1👍

You get the error because (as the error points out) you never use props. You should remove the const props =.

Leave a comment