Bilibili-Evolved 使用指南：3 步把 B 站改成你的样子

Bilibili-Evolved 使用指南：3 步把 B 站改成你的样子

【免费下载链接】Bilibili-Evolved强大的哔哩哔哩增强脚本项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Evolved

B 站页面长什么样、下载什么编码，官方说了算，你插不上手。Bilibili-Evolved 是一个油猴增强脚本，装上后默认零功能，你要的组件从仓库自己装配——本文按 装脚本 → 装第一个功能 → 看懂两个开关 → 做性能调优 走一遍。

先划清边界：能做什么，不做什么

先立一个认知：这个脚本本身不含任何功能。设置面板、启动栏、自动更新这些内置组件（src/components/built-in-components.ts 里共 7 个）是骨架，除此之外全靠自己装。

它做的是"把 B 站页面拼成你的样子"：替换顶栏、重构首页、夜间模式、下载视频和弹幕。它不做的有两件——不是专门的下载器（README 直说只想要下载建议另找），也不对未登录状态做适配。Safari 和套壳浏览器不保证稳定。

从空脚本到第一个功能：3 步走通

前提：最新版 Chrome 或 Firefox，脚本管理器用 Tampermonkey 5.0+ 或 Violentmonkey 2.18+。README 明确标注 Greasemonkey 与 AdGuard 不兼容——这条能省掉后面一半排障。

1. 装好管理器后，从发布链接装正式版脚本，刷新任意 B 站页面；
2. 页面左侧中央出现功能面板入口——到这一步安装就算成功；
3. 打开设置面板 → 左下"组件/插件/样式管理"，有批量（逐行粘贴直链一次装完）、浏览（载入本地文件）、在线（打开在线仓库）三个按钮，加底部一个粘贴单链接的输入框。

装完想确认脚本真注入了，控制台输入window.bilibiliEvolved，有对象输出即正常——脚本在 src/client/init.ts 把对外 API 挂到了unsafeWindow上。

功能在哪找：6 个目录 + 1 套约定

所有功能都放在 registry/lib/components/ 下，按feeds / live / style / touch / utils / video六个目录分。每个功能一个目录，统一是index.ts（元数据与入口）+index.md（自动注入的描述文档）+ 可选的Widget.vue（设置面板里的选项组件）。

几个有代表性的：video/danmaku/把弹幕拆成airborne / converter / download / expand / merger / unescape六个子模块；video/player/是仓库里最大的子目录，集中了播放器层增强；style/custom-navbar/能整条替换顶栏，内部分成 15 个以上子模块。首页重构style/home-redesign/里有fresh与minimal两套方案，前者把信息流重排成卡片布局。

两个开关：什么时候跑、怎么互通

何时跑：src/core/life-cycle.ts 把页面启动拆成headLoaded/contentLoaded/fullyLoaded三个可等待时机。所有组件真正开跑的开关在 src/components/component.ts 的loadAllComponents，它读脚本加载模式（src/core/loading-mode.ts 定义两个值）：

if (generalSettings.scriptLoadingMode === LoadingMode.Delay) { fullyLoaded(() => loadComponents()) // "延后"：等 load 事件，不跟页面抢资源 } else if (generalSettings.scriptLoadingMode === LoadingMode.Race) { contentLoaded(() => loadComponents()) // "同时"：DCL 即跑，可能和 B 站原脚本撞车 }

每个组件用Promise.allSettled单独包裹并打日志，一个挂掉不拖垮其余，控制台会打印失败组件的 name。

怎么互通：组件之间不互相 import，走 src/plugins/data.ts 的数据注入。一方registerData(key, ...对象)交出可改的对象，另一方addData(key, provider)提交修改，getData时一次性应用。把它想成一条单向消息队列——provider 入队后只在getData时消费一次，消费完即销毁，无法撤回。完整案例在 registry/lib/components/video/danmaku/download/index.ts：它往downloadVideo.assets塞一个下载资产，装上后下载列表凭空多一个选项，卸载即消失，两边代码互不认识。另一条通道是 src/plugins/hook.ts 的addHook/getHook（before/after 两段式）。

跟着一份性能日志做一次真实调优

在设置面板打开开发者模式（devMode，是settingsPanel组件的一个选项），刷新后打开控制台，会看到按阶段分组的耗时日志——每行是"组件名 + 毫秒 + 百分比"，由 src/core/performance/stats.ts 的logStats输出，形如components block time: xx ms for N items。找到占比最高的组件，把它的加载模式改成"延后"或停用，再刷一次对比数字。src/core/performance/ 下还有component-trace、plugin-trace、promise-trace三个追踪器，分别对应组件、插件和启动阶段的 Promise。

翻车点都是"现象 → 原因 → 处置"：

• 装完没反应 → 设计如此，默认零组件 → 进设置面板装功能再刷新。
• 弹"脚本试图访问跨域资源" → 链接装组件 / 发下载到外部服务器时的已知提示 → 选"始终允许"。
• 页面明显变卡 → 综合脚本，最低 8GB 内存 / 1920×1080 → 开devMode看logStats，改"延后"或停用。
• 升级后旧版设置错乱 → 新版发布后旧版不再支持 → 升级前在关于面板导出设置，必要时看 doc/rollback.md。

从用的人到写功能的人

想写功能的，先克隆仓库：git clone https://gitcode.com/gh_mirrors/bi/Bilibili-Evolved，然后pnpm install（registry/下还要再装一次依赖），跑pnpm tsx dev-tools/dev-server/index.ts起开发服务，默认 23333 端口。新组件就是在registry/lib/components/<类别>/下建目录，index.ts里用defineComponentMetadata导出，index.md写描述；开发服务对http://localhost:23333/registry/dist/components/<id>.js按需编译、从内存返回，把链接粘进组件管理面板即装即调，改代码自动热更新，dev-tools/dev-server/command.ts 提供单独编译、监听、脚手架等命令。跨功能协作优先addData/addHook，提交前跑pnpm run lint-check和pnpm run type。

这套"元数据 + 懒加载 + 数据注入"的组合，才是它真正能搬走的东西。

【免费下载链接】Bilibili-Evolved强大的哔哩哔哩增强脚本项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Evolved