uniapp+vue3中自动导入ref等依赖

前言：

        在我们使用uni-app+vue3创建项目，开发的过程中，老是需要导入我们的ref、onshow等，那么能不能自动导入，不用我们每个页面都写呢？是没问题的，这里让他的小帮手来帮你减轻负担：他就是：unplugin-auto-import

vue3中的一些生命周期信息https://uniapp.dcloud.net.cn/tutorial/vue-composition-api.html

代码效果展示：

vue3项目 使用我们的小帮手前：

引入ref/reactive/watch  等方法

import {onMounted, ref,watch} from 'vue'

let name = ref('')

引入 onShow等方法

import { onLoad,onShow } from '@dcloudio/uni-app'

onLoad((e)=>{
	console.log('onLoad',e)
})

使用我们小帮手后：

<script setup>
let name = ref('')
onLoad((e)=>{
	console.log('onLoad',e)
})

</script>

如何去使用呢？

1、安装我们的插件

npm i unplugin-auto-import

2、新建一个vue.config.js/vite.config.js文件

如果有跨域等需求也可以加在里面

import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import AutoImport from 'unplugin-auto-import/vite'
 
export default defineConfig({
    plugins: [
        uni(),      
        AutoImport({
            imports:[
                'vue',
                'uni-app'                
            ]
        })
    ]    
})