LoveChengke
ce9bed73f4
动效层：把 beUI 的动效语言移植到两端，令牌放在 packages/shared/src/motion.ts（纯常量，后端也引用得到）。弹簧用数值积分生成 CSS linear()，纯 CSS 即可驱动，不必每组件一个 rAF 循环；两端各一份 composables/motion.ts 负责 DOM 部分，在 app.mount() 之前注入 :root。含 reduced-motion 全局降级与 hover 能力探测；灵动岛只移植单调曲线。
深色主题：Web 管理端补齐，机制与桌面客户端一致；语义色令牌只覆盖颜色，不动圆角与动效令牌。默认跟随系统，用户手动点过之后以用户为准。
图标：build/classhelper.{png,ico} 成为全项目唯一图形源，pnpm icons 从它派生各端图标与界面内品牌标。版本号统一到 1.1.2。
30 lines
1.2 KiB
TypeScript
30 lines
1.2 KiB
TypeScript
import { createApp } from 'vue';
|
|
import IslandApp from './IslandApp.vue';
|
|
import { applyMotionTokens } from '../renderer/composables/motion.js';
|
|
|
|
/**
|
|
* 灵动岛渲染进程入口。
|
|
* 刻意不引入 Element Plus 等 UI 库：这个窗口极小、常驻桌面，
|
|
* 保持零依赖可以让它在低配机器上也瞬间渲染。
|
|
*/
|
|
const app = createApp(IslandApp);
|
|
|
|
/**
|
|
* 动效令牌（beUI 的缓动曲线，见 packages/shared/src/motion.ts）写进 `:root`。
|
|
*
|
|
* **必须在这里也注入一次**：灵动岛是**另一个渲染进程**，不共享主窗口的 `:root`。
|
|
* 而 `IslandApp.vue` 的悬停微交互引用了 `var(--ch-dur-fast)` / `var(--ch-ease-out)`——
|
|
* 变量缺席会让整条 `transition` 简写失效（自定义属性解析不出来 → 声明作废），
|
|
* 结果是**完全没有过渡**，比改造前还差。
|
|
*
|
|
* 成本可控：多出来的是共享模块里的令牌常量与弹簧积分（约 2KB），
|
|
* 相比岛内已经打包的 Vue 可以忽略；换来的是"两端一岛同一套曲线、不各抄一份"。
|
|
*/
|
|
applyMotionTokens();
|
|
|
|
app.config.errorHandler = (error) => {
|
|
console.error('[island] 渲染异常', error);
|
|
};
|
|
|
|
app.mount('#app');
|