VUE3为什么要写在<script setup></script >里

VUE3引入了新的 `<script setup>` 语法来简化组件的编写和提升性能。写在 `<script setup>` 标签内的代码可以利用新的编译器功能进行预编译，将模板和组件选项合并在一起，从而减少了冗余代码和重复工作。

在传统的 Vue 组件中，我们需要手动导入和定义组件选项（如 `data`、`methods`、`computed` 等），并且需要在模板中使用这些选项。而在 `<script setup>` 中，我们只需声明变量和导入函数，无需显式地定义组件选项。编译器会自动推导出组件选项，并将其与模板进行合并。

通过使用 `<script setup>`，我们可以更轻松地编写 Vue 组件，减少了样板代码，提高了开发效率。此外，由于编译器对 `<script setup>` 进行了优化，组件的性能也得到了提升。