vue3 自动按需引入插件

目录

前言：

 1、下载插件：

2、插件配置：vite.config.ts

3、特别说明：

---

前言：

习惯了vue2那种不用引入vue API的简便，再用vue3时发现不管写什么你都要去引入比如“ref”什么的，那么会感到很繁琐，那么该怎么办呢？因此就找到了自动按需引入的一款插件《unplugin-auto-import》

插件地址：https://github.com/antfu/unplugin-auto-import

这款插件呢我们的vue尤大是赞助了的。

附图：

 1、下载插件：

npm i -D unplugin-auto-import

2、插件配置：vite.config.ts

import AutoImport from 'unplugin-auto-import/vite'

export default defineConfig({
  plugins: [vue(),
  AutoImport({
    imports: ["vue", "vue-router"], //自动引入vue的ref、toRefs、onmounted等，无需在页面中再次引入
    dts: "/AutoImport.config.ts" // 生成AutoImport.config.ts的声明文件
  }),
 
  ],

})

3、特别说明：

配置方式适合vite+ts的vue3项目，其他方式的项目自行寻找合适的方法。另外如果你项目中element-plus已经做过按需引入，那么你可以跳过第一步。