更新记录

0.1.0（2024-07-27） 下载此版本

平台兼容性

uni-app

uni-app x

Root

借助 Vite 模拟出虚拟的全局组件，解决 uniapp 无根组件导致无法使用全局共享组件问题

📦 安装

可以直接从插件导入 或者 采用node包

pnpm add -D @uni-ku/root@latest

🚀 使用

1. 引入 @uni-ku/root

// vite.config.*

import { defineConfig } from 'vite'
import UniKuRoot from '@uni-ku/root'

export default defineConfig({
  plugins: [
    // 若存在改变 pages.json 的插件，请将 UniKuRoot 放置其后
    UniKuRoot()
  ]
})

2. 根目录下创建 App.ku.vue 并添加全局所需组件或代码

通过标签 <KuRootView /> 或 <ku-root-view /> 实现指定共享组件存放位置，该功能与 VueRouter 中的 RouterView 实现类似

<!-- App.ku.vue -->

<script setup lang="ts">
import { ref } from 'vue'
import GlobalToast from './components/GlobalToast.vue'

const helloVueRef = ref('test')
</script>

<template>
  <div>Hello AppKuVue</div>
  <KuRootView />
  <div>{{ helloVueRef }}</div>
  <GlobalToast />
</template>

✨ 例子

全局Toast组件核心实现请关注: src/components src/composables

• 🔗 查看完整例子

📝 待办

• [x] 支持热更新
• [x] 支持VueSFC
• [x] 支持小程序PageMeta
• [ ] 补全单元测试

📫 项目地址

• Github: @uni-root

如果对此项目感到兴奋，可以点个 star ⭐💜