unplugin-auto-import/vite的使用攻略

184 阅读1分钟

unplugin-auto-import/vite的使用

gitCode:https://gitcode.com/unplugin/unplugin-auto-import/overview?isLogin=1

解决的问题:

1、为了vue3+vite简介的代码语法

without:
import {ref,reactive,computed} from 'vue'

const data_a = ref(0)
const data_b = computed(()=>{return data_a * 2})
with:
const data_a = ref(0)
const data_b = computed(()=>{return data_a * 2})

2、变量导出更优化简介,且大大减少多变量多方法情况下的引用工作量和准确度以及代码简洁性

借图---举个栗子

想要实现以下方法可在类方法UseTips中暴露出去方便引用,

image.png

image.png

可使用以下方法: 先导出: image.png 再使用unplugin-auto-import/vite,配置一下,(别忘了install) image.png 然后注册一下

image.png 项目中即可:

image.png 看,多简洁。。。。。

还可以再研究下:

unplugin-vue-components :# 尤大推荐的神器unplugin-vue-components,解放双手!以后再也不用呆呆的手动引入(组件,ui(Element-ui)库,vue hooks等),

juejin.cn/post/701244…