用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/TencentBlueKing/bk-bcs --skill vite命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
基于 SOC 职业分类
正在显示 SKILL.md
| id | eng-bundle-opt |
| name | Vite 构建产物体积优化 |
| category | engineering |
| description | 使用 Rollup Visualizer 分析产物，并通过拆包 (Code Splitting) 和 Tree Shaking 减少首屏体积。 |
| tags | ["vite","rollup","performance","optimization"] |
| updated_at | 2026-01-09T00:00:00.000Z |
当首屏加载慢 (FCP > 1.5s) 时，通常需要检查 JS Bundle 的体积。
首先"看见"哪些包最大。
npm install rollup-plugin-visualizer -D
这是收益最大的优化点。
❌ import UserList from './views/UserList.vue'
✅ component: () => import('./views/UserList.vue')
将大型库（ECharts, bkui-vue）单独打包，避免 vendor hash 频繁变化。
❌ import _ from 'lodash'
✅ import debounce from 'lodash-es/debounce'
npm install vite-plugin-compression -D
📦 获取完整 vite.config.ts 配置：
skill://bundle-optimization/assets/vite.config.optimization.ts
skill://bundle-optimization/assets/vite.config.optimization.ts根据 SKILL.md 中的 IF-THEN 规则判断是否需要加载