更新记录
0.1.0(2024-07-27) 下载此版本
平台兼容性
uni-app
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
× | √ | √ | √ | √ | - | - | - | - |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | - | √ | √ | √ | √ |
其他
多语言 | 暗黑模式 | 宽屏模式 |
---|---|---|
× | × | √ |
Root
借助 Vite 模拟出虚拟的全局组件,解决 uniapp 无根组件导致无法使用全局共享组件问题
📦 安装
可以直接从插件导入 或者 采用node包
pnpm add -D @uni-ku/root@latest
🚀 使用
- 引入
@uni-ku/root
// vite.config.*
import { defineConfig } from 'vite'
import UniKuRoot from '@uni-ku/root'
export default defineConfig({
plugins: [
// 若存在改变 pages.json 的插件,请将 UniKuRoot 放置其后
UniKuRoot()
]
})
- 根目录下创建
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
- [ ] 补全单元测试
📫 项目地址
如果对此项目感到兴奋,可以点个 star ⭐💜