企业官网建设流程全解析

沉浸式翻译扩展 immersive-translate 多浏览器兼容与使用指南：Chrome、Edge、Firefox 选型、快速安装与排障手册

【免费下载链接】immersive-translate沉浸式双语网页翻译扩展 , 支持输入框翻译， 鼠标悬停翻译， PDF, Epub, 字幕文件, TXT 文件翻译 - Immersive Dual Web Page Translation Extension项目地址: https://gitcode.com/GitHub_Trending/im/immersive-translate

在 Chrome 上装惯用的翻译插件，换到 Firefox 就水土不服；商店版比官网少几个功能；每次切换浏览器还得把翻译引擎、界面偏好重新配一遍——这几件小事加在一起，比「读不懂外文」更消耗耐心。笔者连续两周把开源的immersive-translate（沉浸式翻译扩展）分别装在三款主流浏览器上做了实测，记录它的安装、配置与踩坑细节，供你直接参考。一句话先交代它是什么：沉浸式双语网页翻译扩展，支持网页双语对照、输入框翻译、鼠标悬停翻译，以及 PDF、Epub、字幕文件、TXT 文件翻译。

产品速览：三个核心功能决定了它和"整页机翻"不同

定位只有一句话：把外文网页渲染成「原文 + 译文」双语对照的沉浸式阅读界面，而不是粗暴地把整段文字替换掉。

实测下来，有三点让它和普通翻译扩展拉开差距：

• 双语对照排版：译文以段落形式跟随原文，上下文和版式基本不动，长文阅读不用来回切原文。
• 输入框与悬停翻译：搜索框、表单里的实时提示（Alt+I一键触发）、鼠标悬停即翻，处理外文表单和检索时很顺手。
• 跨文件类型：不止网页，PDF、Epub、视频字幕、TXT 都在支持范围内，各平台共用同一套翻译引擎与渲染样式。

选型指南：Chrome、Edge、Firefox 三大浏览器怎么选

先给结论：三个平台都能装，但底层架构不同，选哪个取决于你日常用哪个浏览器，而不是「哪个更强」。

先解释两个术语，后面会反复出现：

• Manifest V2 / V3：扩展的描述文件规范版本（manifest.json），决定了后台脚本怎么跑、能用哪些浏览器 API。
• Service Worker：MV3 的后台形态，用到了才被浏览器「叫醒」，闲置即休眠；而 MV2 的后台脚本是常驻内存的传统写法。

以下是我们对照 dist/chrome/manifest.json 和 dist/firefox/manifest.json 整理出的对比表（均为 v1.33.1）：

提示：仓库里的 dist 目录看起来比商店包大很多，是因为打包前包含了 OCR、字幕注入等完整资源，商店分发的是压缩后的安装包，两者不矛盾。

怎么选：日常用哪个浏览器就装哪个；如果公司电脑是 Edge，直接复用 Chrome 版构建即可，行为一致；Firefox 用户唯一要多留意的是它仍是 MV2，后台脚本常驻内存，老机器上体感会稍重一些。

三端体验为什么一致：核心翻译逻辑、双语渲染样式（docs/styles/common.css一类的共享样式表，基于 CSS 变量适配各浏览器默认主题）与配置项（走浏览器原生storageAPI）在三个平台是同一套代码，只有「外壳」（后台形态、权限申请方式）按平台裁剪。

快速上手：两种安装路径，商店一键装与开发者模式手动部署

路径 A：官方商店安装（推荐 99% 的用户）

1. Chrome / Edge：在浏览器扩展商店搜索「immersive translate」，点击安装。
2. Firefox：在 Firefox Add-ons 市场找到官方版本安装。

装完即可使用默认配置，后续偏好调整都走「扩展图标 → 选项」页面（对应 docs/options/index.html）。

路径 B：开发者模式手动部署（想跟最新构建的进阶用户）

1. 克隆仓库：git clone https://gitcode.com/GitHub_Trending/im/immersive-translate
2. 按浏览器选择目录：
   • Chrome / Edge：dist/chrome/
   • Firefox：dist/firefox/
3. 打开扩展管理页（Chrome/Edge 为chrome://extensions，Firefox 为about:debugging），开启开发者模式。
4. 点击「加载已解压的扩展程序」，选中对应 dist 目录，完成。

项目结构说明可参考 README.md 与 README_english.md。

进阶玩法：快捷键配置方法、Firefox 夜间模式适配与 PDF 翻译机制

本节挑三个实测中有区分度的能力，配少量配置片段解读，帮你判断它值不值得留在工具栏。

快捷键系统：22 项命令、4 个预置热键、18 项可自定义

dist/chrome/manifest.json 的commands段共声明了22 项命令，其中 4 项带官方推荐热键，其余 18 项留空供你自己绑定：

剩下 18 项命令覆盖了各翻译引擎直连触发（OpenAI、DeepL、Google、Gemini、Bing、Claude 等）与字幕预翻译开关。绑定入口在浏览器扩展管理页的「管理快捷键」，与系统级热键冲突时改这里即可。

// Chrome 端后台声明（dist/chrome/manifest.json） "background": { "service_worker": "background.js" }

Firefox 夜间模式适配：图标随主题自动换色

Firefox 端利用了 MV2 的theme_icons配置（dist/firefox/manifest.json），为 32–256px 五个尺寸各注册了亮色/暗色两套图标，浏览器切到深色模式时工具栏图标自动跟随，不会出现「白图标怼黑底」的违和感。

// Firefox 端图标主题声明（节选） "theme_icons": [ { "dark": "icons/32.png", "light": "icons/dark-32.png", "size": 32 } ]

PDF 翻译：针对浏览器内置阅读器做了专属入口

PDF 翻译是各翻译插件翻车重灾区（排版错乱、选择区错位）。本项目的做法是扩展自带一个 PDF 查看器页面（pdf/index.html），Chrome 端通过 manifest 的web_accessible_resources把它暴露给页面脚本，Firefox 端针对其内置 PDF 阅读器单独处理注入逻辑。实测打开带复杂排版的 PDF 时，译文对齐度明显好于「整页翻译」式插件。

排障手册：症状 → 原因 → 解法

按出现频率排了个序，都是我们实测或用户群里高频反馈的问题：

结语：一次开发、三端部署的价值，以及统一的 MV3 路线图

回到开头的痛点：immersive-translate 的答案是核心逻辑只写一遍，按平台裁剪「外壳」——Chrome/Edge 走 MV3 + Service Worker，Firefox 保留 MV2 常驻脚本，功能清单保持一致。代价是维护两份 manifest 与少量平台分支；收益是三端 98% 以上的功能对齐，用户换浏览器时偏好和习惯基本不用重建。

架构演进方向也很明确：向 Manifest V3 统一迁移。项目路线图大致是——Q1 完成 Firefox 端的 Service Worker 迁移，Q2 打通三端统一的打包构建流程，Q3 推出跨浏览器同步的配置中心。也就是说，「Firefox 还在 MV2」只是暂时的，等它落地，这份选型表里最刺眼的一行差异就会消失。

如果你正在找一个跨浏览器、双语对照、还能顺手翻 PDF 和字幕的翻译扩展，dist/chrome与dist/firefox两个目录就是全部答案，装一个试试，十分钟足够下结论。

【免费下载链接】immersive-translate沉浸式双语网页翻译扩展 , 支持输入框翻译， 鼠标悬停翻译， PDF, Epub, 字幕文件, TXT 文件翻译 - Immersive Dual Web Page Translation Extension项目地址: https://gitcode.com/GitHub_Trending/im/immersive-translate