39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
/**
|
|
* 侧边栏图标名 → Lucide 组件 的映射。
|
|
*
|
|
* 为什么必须是「字符串 → 组件」而不是直接把组件写进 config：
|
|
*
|
|
* VitePress 会把 themeConfig（含 sidebar）序列化后传给客户端。序列化器
|
|
* serializeFunctions 会把函数转成 `_vp-fn_...` 字符串，再由客户端
|
|
* `new Function()` 反序列化重建。Lucide 图标是 Vue 组件对象（含 render/
|
|
* setup 及闭包里的 path 数据），既不是纯函数、也无法靠 new Function
|
|
* 还原其模块级依赖 —— 结果就是图标在渲染时丢失（上一版实测 has-icon
|
|
* 类都不出现）。
|
|
*
|
|
* 因此这里让 config 里只写图标「名字」，真正的组件引用留在主题这一侧
|
|
* （客户端模块里，import 正常保留），渲染时按名查表。
|
|
*
|
|
* 需要新图标时：在 @lucide/vue 里选一个，import 进来并在此登记名字即可。
|
|
*/
|
|
import {
|
|
Cable,
|
|
Component,
|
|
Boxes,
|
|
FormInput,
|
|
Layers,
|
|
MessageSquare,
|
|
TableProperties,
|
|
LayoutDashboard,
|
|
} from '@lucide/vue'
|
|
|
|
export const sidebarIcons: Record<string, unknown> = {
|
|
cable: Cable,
|
|
component: Component,
|
|
boxes: Boxes,
|
|
'form-input': FormInput,
|
|
layers: Layers,
|
|
'message-square': MessageSquare,
|
|
'table-properties': TableProperties,
|
|
'layout-dashboard': LayoutDashboard,
|
|
}
|