更新记录

0.1.0(2024-07-27) 下载此版本


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 app-vue
钉钉小程序 快手小程序 飞书小程序 京东小程序
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

Root

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

NPM version NPM downloads

📦 安装

可以直接从插件导入 或者 采用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()
  ]
})
  1. 根目录下创建 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 ⭐💜

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问