企业官网建设流程全解析

eHunter终极指南：双模式阅读改造，让漫画浏览体验提升一个量级

【免费下载链接】eHunterFor the best reading experience项目地址: https://gitcode.com/gh_mirrors/eh/eHunter

你是否也经历过这样的夜晚：打开常逛的漫画站，准备补完追更已久的一部作品，却要面对一屏只有一张图的默认页面、又小又糊的缩略图，翻页全靠一次次点击，加载还时快时慢——读不了十页，耐心先被磨没了。eHunter 正是为这类痛点而生的开源油猴脚本：它通过在原页面注入 Vue 组件，把漫画与插画浏览改造成卷轴式（Scroll）与书本式（Book）两种模式，让阅读从"翻网页"升级为"读书"。

🔧 先认识这台"页面改造机"

很多工具的做法是"再造一个应用，让你把内容导入进来"。eHunter 的思路完全不同：它直接在原页面上新创建一个节点，把 Vue 注入其中，再用基于 fetch 实现的爬虫解析原站 DOM、提取漫画图片地址，最后渲染出一套全新的阅读界面。不换站、不搬家，只是把"看"的方式彻底重做。

这个设计带来三个实打实的好处：

• 不破坏你的使用习惯：收藏、评论、进度都留在原站，变的只有阅读层；
• 天然支持多平台：实现上基本隔离了具体环境，目前内置 EH/EXH 与 NH 两套平台实现，稍作适配就能移植到其他漫画站点；
• 移动端也能用：官方为 iPhone/iPad 提供了专门的配置指南，触屏设备同样能享受这次改造。

⚡ 3分钟完成环境搭建，今晚就能读

eHunter 以用户脚本形式分发，所以先要装一个"脚本管理器"。

第 1 步：安装管理器。Chrome 或 Firefox 用户安装 Tampermonkey（暴力猴亦可），装好后工具栏会出现一个小图标。

第 2 步：获取源码并构建。打开终端，执行以下命令：

git clone https://gitcode.com/gh_mirrors/eh/eHunter cd eHunter npm install npm run build-prod

• npm install：安装全部项目依赖；
• npm run build-prod：直接生成可供油猴使用的用户脚本版本，产物在dist/目录下。

第 3 步：加载脚本。在 Tampermonkey 管理面板新建脚本，把dist/inject.js的内容粘贴进去保存。刷新目标站点页面，顶部出现绿色阅读工具栏——改造完成。

小贴士：想参与开发，把build-prod换成npm run dev即可进入 Vite 开发模式，改动实时生效。

📜 实验一：卷轴模式如何治好"随手翻"的痛

面对插画集、同人志封面这类没有连贯剧情的内容，你的真实需求是"快速扫图"。卷轴模式就是为此设计的：主区单页大图、页面垂直滚动、左侧缩略图栏常驻。

• 缩放随心：工具栏可直接把页面缩放到 55%~100%，适配不同屏幕；
• 批量加载：一次预载多张页面，滚动过程不卡顿；
• 缩略图定位：侧栏缩略图既是预览也是导航，读到哪一页一目了然。

下面就是 eHunter 卷轴模式批量预览插画的效果——左侧缩略图栏负责快速定位，主区单页大图保持专注：

滚动模式下左侧缩略图栏加单页大图，工具栏可实时调节缩放与加载数量。

📖 实验二：书籍模式如何让人"读进去"

当内容换成有剧情的漫画，你的体验诉求会从"快"变成"沉浸"。切换到书籍模式，阅读器会模拟真实书籍的呈现方式：

• 双页显示：一屏左右两页，贴近实体书的翻页节奏；
• 方向可调：支持 RTL/LTR 两种阅读方向，日漫从右往左、欧美漫从左往右；
• 批量预载：可设置同时加载 3~5 页，翻页几乎零等待；
• 翻页动画：平滑的过渡配合底部页码导航，阅读进度始终心中有数。

书籍模式下双页并列显示，工具栏标注了 2P 双页与 RTL 阅读方向，底部为页码导航。

🧰 藏在细节里的工具箱：放大镜、页面菜单与打包下载

两种模式之外，eHunter 还有一批值得单独拿出来讲的能力：

• 页面放大镜：桌面端开启后，移动鼠标即可在 2x/3x/4x/5x 四档倍率间细看局部，适合检查网点、线稿与小字，且设置会跨页继承；
• 上下文页面菜单：滚动模式单击图片、书籍模式点击中间留白区即可呼出，内含"加载原图""奇偶切换"等按场景自动显隐的操作；
• 画廊打包下载：基于 GalleryDownloadService，支持把整个画廊批量打包，方便建立本地收藏库；
• 更多设置与可停靠面板：阅读偏好精细可调，工具面板支持停靠拖动，缩略图还能展开成大图预览。

书籍模式下缩略图栏依旧可用，帮助你快速定位分镜与章节。

💻 开发者视角：一份"读得懂"的改造代码

如果你不只是想用，还想动手改，eHunter 的架构对开发者相当友好：

• 平台层与渲染层分离：src/platform/集中存放站点识别、初始化与平台服务工厂，EH、NH 各占一目录；新增平台时仿照现有模块写解析器与服务即可；
• 组件可直接复用：core/components/中的 AlbumBookView、AlbumScrollView、PageView 等均为自建组件，不依赖第三方 UI 库，可平滑接入新功能；
• 设计有文档沉淀：specs/下每个功能都配有独立的 spec、plan、contract 文档，顺着文档就能推进一个完整功能。

技术栈为 Vite + Vue 3 + TypeScript + SCSS，边界清晰、风格统一，作为"用户脚本 + 前端框架注入"的学习样板也相当合适。

⚠️ 避坑手册：三个最常见的坑

坑 1：脚本不生效。先确认 Tampermonkey 是否启用、脚本是否在该站点激活，再看控制台有无报错——多数情况是"装了但没开"。

坑 2：构建产物为空或页面异常。检查npm install是否完整、Node 版本是否达标，然后重新执行一次npm run build-prod并替换脚本内容。

坑 3：放大镜"不见了"。放大镜仅桌面端可用，且只在当前页面内生效、鼠标移出即隐藏——在手机上找不到它是正常现象，不必担心。

✅ 收尾：你的收获清单

读完这篇指南，你已经掌握：

• ✅ eHunter 是什么——一款用 Vue 注入原站、提供卷轴式与书本式阅读的开源用户脚本；
• ✅ 如何 3 步完成环境搭建——装管理器、构建脚本、加载进 Tampermonkey；
• ✅ 两种模式的取舍——扫图用卷轴，追更用书籍，再配合缩略图与放大镜把体验拉满；
• ✅ 开发者入口在哪——src/platform/加平台、core/components/复用组件、specs/读设计文档。

现在就 clone 项目、跑一次npm run build-prod，今晚就给自己换一套阅读体验。读得舒服，才是真的享受。

【免费下载链接】eHunterFor the best reading experience项目地址: https://gitcode.com/gh_mirrors/eh/eHunter