种草 Vue3 中几个好玩的插件和配置

摘要

松哥正在录制TienChin项目视频教程，涉及到Spring Boot和Vue3技术栈。本文介绍了TienChin项目中使用的一些Vue3插件和配置。

1. Vite

Vite是一款前端构建工具，由开发服务器和构建指令两部分组成，提供快速的模块热更新和高效的生产环境构建。Vite提供开箱即用的配置，插件API和JavaScript API带来可扩展性，并支持类型检查。

2. 自动导入常见方法

在TienChin项目中，使用unplugin-auto-import插件可以实现方法的自动导入，无需手动导入即可使用如useRouter等方法。

2.1 传统写法

传统的Vue组件中需要手动导入如useRouter或getCurrentInstance等方法来使用。

2.2 自动导入

通过配置unplugin-auto-import插件，可以自动导入Vue和Vue-router等库中的方法。

3. 组件去后缀

Vite要求在导入组件时包含文件后缀，但可以通过配置vite.config.js文件来支持省略.vue和.js等后缀。

4. name属性问题

Vue3中设置组件名需要使用两个script节点，但通过vite-plugin-vue-setup-extend插件可以简化这一过程，允许直接在script节点中定义name。

松哥将在后续视频中介绍VueUse工具的使用，继续深入探讨TienChin项目的前端技术。