upgrade to [email protected] and use <script setup>

[canvascat]

Two new features for Single File Components (SFCs, aka files) have graduated from experimental status and are now considered stable:.vue

• <script setup> is a compile-time syntactic sugar that greatly improves the ergonomics when using Composition API inside SFCs.
• <style> v-bind enables component state-driven dynamic CSS values in SFC tags.<style>

https://blog.vuejs.org/posts/vue-3.2.html ✌