@melt-js/libs-bag-host

@melt-js/libs-bag-host 是这套后台框架里的宿主层。它不承载具体业务，而是把一套后台应用真正跑起来需要的东西收在一起：默认布局、菜单状态、标签页缓存、权限指令、i18n 初始化、插件注册和路由引导。

如果把 @melt-js/libs-bag-core 理解成协议层，那 @melt-js/libs-bag-host 更像是“协议的执行器”。

安装

pnpm add @melt-js/libs-bag-host @melt-js/libs-bag-core @melt-js/libs-bag-request @melt-js/libs-bag-ui

@melt-js/libs-bag-host 依赖宿主项目自行提供 vue、vue-router、pinia、vue-i18n 和 naive-ui。如果你是通过 create-vue-bag-admin 初始化项目，这部分依赖会直接给你带好。

它负责什么

• 创建宿主路由，并接管登录态与权限前置校验
• 启动插件，把插件的 routes、menus、locales 和 install 钩子挂进应用
• 提供默认后台壳层 HostApp
• 暴露宿主 store，比如 useUserStore、useMenuStore、useTabBarStore
• 提供 v-permission 指令和 PermissionAccess 组件

快速接入

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import {
  HostApp,
  PermissionAccess,
  bootstrapPlugins,
  createHostI18n,
  createHostRouter,
  registerPermissionDirective
} from '@melt-js/libs-bag-host'

完整入口可以参考示例应用 tpl-vue3-admin-naive-bag/src/main.ts。

如果你使用默认壳层，记得同时引入样式入口：

import '@melt-js/libs-bag-host/style.css'

当前公开能力

• HostApp
• PermissionAccess
• createHostI18n()
• createHostRouter({ routes, auth })
• bootstrapPlugins({ app, router, i18n, plugins })
• registerPermissionDirective(app)
• useAppConfigStore()
• useMenuStore()
• useTabBarStore()
• useUserStore()

设计边界

• 这个包自带一套默认后台布局，适合先跑起来，再按项目风格替换。
• 路由鉴权支持 auth: false、auth: true 和自定义 auth 配置；轻量接入不再要求必须提供 /login 页面。
• 现在已经提供可发布的包入口、类型产物和样式入口；后续演进重点会放在宿主适配能力，而不是继续堆叠业务模块。

推荐搭配

• @melt-js/libs-bag-core: 插件协议、Schema 协议、字典协议
• @melt-js/libs-bag-ui: Schema 组件层
• @melt-js/libs-bag-request: HTTP / WS 能力
• @melt-js/libs-bag-entry: 初始化宿主工程