Files
aiot-platform-ui/apps/web-antd/vite.config.mts
lzh 6b8626907e feat(@vben/web-antd): Lottie 品牌加载动画(主题色自适应)
- 新增全局 loading:自定义 apps/web-antd/loading.html 覆盖 inject-app-loading
  的默认模板,Vue 挂载前就能播放品牌动画
- 新增 LottieLoading 组件,用于 SSO 回调等"白屏时间偏长"的运行时场景
- 换色方案:Lottie JSON 里原本 5 档硬编码绿色,按当前主题 colorPrimary
  生成 5 档 HSL 亮度做指纹替换。挂载前从 localStorage preferences 读色,
  挂载后读 CSS 变量 --primary,两条路径共用 public/lottie-theme-patch.js
  一份 classic-JS 源,window.__LottieThemePatch__ 上暴露
- vite 插件:启动/构建时从 node_modules 把 lottie_light.min.js 拷到
  public/ 供 loading.html <script> 加载;.gitignore 排除该产物
- LottieLoading 复用 loading.html 已经挂好的 window.lottie,不再把
  ~170KB 播放器再打进 Vue 产物

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-23 20:26:48 +08:00

51 lines
1.4 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import type { Plugin } from 'vite';
import { copyFileSync, mkdirSync } from 'node:fs';
import { createRequire } from 'node:module';
import { dirname, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
import { defineConfig } from '@vben/vite-config';
/**
* 启动/构建时把 lottie-web 的 light 播放器从 node_modules 拷到 public/
* 供 loading.html 以 <script src="/lottie_light.min.js"> 方式加载。
* 直接覆盖拷贝(~170KB<1ms避免 mtime 粒度在部分 FS 上漏拷。
*/
function copyLottiePlayer(): Plugin {
const require = createRequire(import.meta.url);
const src = require.resolve('lottie-web/build/player/lottie_light.min.js');
const dest = resolve(
dirname(fileURLToPath(import.meta.url)),
'public/lottie_light.min.js',
);
return {
name: 'web-antd:copy-lottie-player',
configResolved() {
mkdirSync(dirname(dest), { recursive: true });
copyFileSync(src, dest);
},
};
}
export default defineConfig(async () => {
return {
application: {},
vite: {
plugins: [copyLottiePlayer()],
server: {
proxy: {
'/admin-api': {
changeOrigin: true,
rewrite: (path) => path.replace(/^\/admin-api/, ''),
// mock代理目标地址
target: 'http://localhost:48080/admin-api',
ws: true,
},
},
},
},
};
});