In Vue, you can easily register a custom directive by creating an object containing lifecycle hooks with the 'v-' prefix.
<script setup>
// enables v-focus in templates
const vFocus = {
mounted: (el) => el.focus()
}
</script>
<template>
<input v-focus />
</template>