Vue3项目中给组件命名的方式

1.不是用插件给组件设置名称的方式

<template>
    <div><div>
</template>
<script lang="ts">
export default {
    name: "xxxx"
}
</script>

<script lang="ts" setup>

</script>
<style scoped></style>

2.通过vite-plugin-vue-setup-extend插件(推荐)

<template>
    <div><div>
</template>
<script lang="ts" setup name="xxxx">

</script>
<style scoped></style>

3.vite-plugin-vue-setup-extend安装与配置

（1）第一步

npm i vite-plugin-vue-setup-extend -D

（2）第二步配置vite.config.ts

import VueSetupExtend from "vite-plugin-vue-setup-extend";

export default defineConfig({
    plugins: [
        ...
        VueSetupExtend()
    ],
    ...
})