向我解释一下 XKCD

2025-06-07

向我解释一下 XKCD

制作我的第一个浏览器插件

我感觉我的大多数粉丝都已经知道XKCD了,这个网络漫画已经成为了宅文化的主流。如果你还没听说过,那么恭喜你!你是今天那10000个幸运儿之一!

XKCD的

多年来,我一直虔诚地关注着 XKCD,几乎每部漫画都看得津津有味。然而,偶尔也会有一部漫画我看不懂;也许是某个晦涩难懂的数学参考,又或者某个我还没开始看编程的参考。在这样的日子里,我非常感激Explain XKCD,一个类似维基百科的网站,书呆子们聚集在这里,对所有网络漫画进行讲解。

解释 XKCD 徽标

几天前,我正在寻找一个小项目来帮助我进入浏览器插件的世界,我想到为每个 XKCD 漫画添加一个链接,以便用户直接进入 Explain XKCD 上的相应页面。

当我开始时,我不知道制作浏览器插件需要做什么,但我想我会花一个晚上开始,也许在周末完成它。

我最终对它的简单程度感到惊讶,坐在电脑前 2 个小时内,我就阅读了文档,编写了一个可用的插件,打包了它,并在Mozilla 的附加组件商店获得了批准!

插件运行截图
注意到新按钮了吗?

Mozilla 拥有出色的文档,描述了从开始到结束的整个过程,包括您可以编写代码的示例插件。

这个过程本身相对简单。一个浏览器插件至少包含一个 manifest.json 文件,其中包含插件的相关信息(名称、版本、需要处理的 URL),以及一个包含实际代码的 JavaScript 文件。

当然,JavaScript 可以根据您的需要变得非常复杂,但就我而言,整个插件包含的代码不到 20 行。

如果您和我一样喜欢 XKCD,我将非常感激您下载了该扩展程序(您可以在这里找到Firefox 的扩展程序,在这里找到 Chrome 的扩展程序)并让我知道它的使用效果!

我们随时欢迎在GitHub 项目页面上提供反馈。


本文转载自我的博客“Rabbi On Rails”
你可以在那里阅读更多我的编程历程,或者在 Twitter 上关注我@yechielk。

文章来源:https://dev.to/yechielk/explain-xkcd-to-me-14dl
PREV
需要拥抱吗?有个机器人可以帮你!拥抱机器人
NEXT
无视图的 Vue - 无渲染组件简介