本文作者分享了其首个Chrome扩展程序“Bear.Share”的开发经历。这款工具能够将任何网页内容一键转化为精美的分享卡片，方便用户进行内容推荐和社交分享。其核心功能包括多种卡片模板、自动生成二维码以及添加个人签名，操作简便，支持通过浏览器扩展图标或右键菜单启动。作者强调了AI在开发过程中的巨大作用，表示该项目几乎完全由AI辅助完成，仅用三天碎片时间便实现从想法到上架。此外，作者还分享了利用AI辅助生成宣传图的有趣方法，展示了AI在设计领域的潜力，并鼓励其他开发者尝试AI辅助开发，实现创意想法。

✨ **Bear.Share 是一款创新的Chrome扩展程序，能够将任意网页内容一键转换为专业的分享卡片。** 该工具旨在简化用户分享网页内容的过程，无论是推荐好文章还是分享有趣新闻，都能快速生成精美的分享图。其核心功能包括提供多种可供选择的卡片模板，自动生成方便移动端访问的二维码，以及允许用户添加个性化的签名，操作流程极致简化，真正实现“一键生成”。

🚀 **AI在Bear.Share的开发过程中扮演了核心角色，极大地提升了开发效率。** 作者提到，在AI的辅助下，仅用了三天碎片时间就完成了整个项目。从最初的代码编写到后期样式的调整，几乎所有代码都是由AI生成的，这让作者深刻体会到AI在项目开发中的强大能力。作者还分享了开发过程中曾面临免费额度耗尽的挑战，但通过充分利用GitHub Copilot等AI工具，最终顺利完成了项目。

🎨 **作者分享了利用AI生成宣传图的独特思路，展示了AI在创意设计领域的应用潜力。** 在为扩展程序准备上架材料时，作者尝试了多种方法来制作宣传图。最终，他采用了将Figma生成的代码包交给AI分析并运行，再通过GitHub Copilot进行“设计”和调整，最后利用`html2canvas`导出图片的方式。这种将AI用于前端代码的“设计”方法，不仅解决了设计难题，还能支持多语言导出，为AI辅助设计提供了新的视角。

💡 **此次开发经历让作者对AI辅助开发有了全新的认识，并鼓励读者拥抱AI技术。** 作者认为，AI不仅可以作为搜索引擎的补充，更能深度参与到项目开发的全过程中，甚至独立完成整个项目的开发。他鼓励其他开发者也尝试利用AI来帮助实现自己的小想法，相信AI的便捷性和强大功能会带来意想不到的成果，推动个人创意的实现。

开个香槟先🍾～ 我人生的第一个 Chrome 扩展上线了！🎉

事情是这样的，最近摸鱼的时候看到几个 Markdown 转分享卡片的小工具，试了试觉得挺有意思。上周三再次看到一个类似的新工具，然后脑子里就冒出个想法：既然 Markdown 能做分享卡片，那我平时看到的好网页为啥不能也一键生成个漂亮的分享图呢？

想必大家都知道作为一个码农突然有个新的 idea 的那种感觉吧，想法一来就停不下来。说干就干，立马撸起袖子开始搞。

遇到点小插曲，但问题不大

一开始用 Cursor 写代码，结果没用多久免费额度就见底了（贫穷限制了我的发挥）。好在想起来 GitHub Copilot 我订阅了快两年，平时一直只是当个代码补全用，现在想想真的是亏大了！

在 AI 的帮助下，三天的碎片时间就搞定了这个小作品：Bear.Share

这个小工具能帮你做什么？

简单说就是把任何网页内容一键变成精美的分享卡片！不管是看到好文章想推荐给朋友，还是发现有趣的新闻想分享到朋友圈，都能快速生成那种很专业的分享图。

功能也不复杂，但该有的都有：

多种卡片模板随你选自动生成二维码（方便移动端访问）可以加上自己的个人签名操作超级简单，真的是一键生成

用起来有多方便？

两种方式启动，怎么顺手怎么来：

直接点浏览器扩展图标在网页上右键选择分享

想试试的话...

Chrome 商店地址在这里：

Bear.Share - 网页分享卡片生成器 - Chrome 应用商店

扩展完全免费，装上试试呗！如果觉得还不错，记得给个好评哈，对我这种新手开发者来说真的很重要～

---

顺便唠叨几句

现在的 AI 真的太厉害了！几年前我还把它当搜索引擎的补充或增强，去年学 Swift 的时候 AI 也就是帮忙写写代码片段。现在竟然能替我完成整个项目开发，而且这个扩展几乎没有一行代码是我亲手写的，最多就是调了调样式。

整个开发过程也就用了 3 天的碎片时间：前两天主要功能开发，第三天调样式 + 准备上架材料。效率高得我自己都有点不敢相信。

---

小彩蛋分享：那些宣传图是怎么做的？

说到上架材料，上架材料中需要各种尺寸的宣传图，就像上面正文中的那种宣传图，一定有很多设计困难的程序猿同行都为此头疼过，我也一样！这里的我起初想用绘图 AI ，但考虑到后期调整麻烦就放弃了（特别是图片中的文字可能需要多次编辑调整）。然后我试了试 Figma 推出的 Figma make ，搞了半天，结果发现生成的竟然是网页而不是设计稿 🤯，也不好改。

然后我灵机一动——既然 Figma make 能生成前端代码包，那我为啥不直接用 GitHub Copilot 来"设计"宣传图呢？

就这么着，我把 Figma 生成的代码包下载下来，丢给 AI 分析项目需要的依赖包，自动安装上依赖，项目就跑起来了！虽然不如专业设计工具那么方便，但该调的都能调，最后还能像前端项目一样支持多语言，用 html2canvas 直接导出图片。这个思路是不是挺有意思的？😄

总之，这次小尝试让我对 AI 辅助开发有了全新认识。说不定你也可以试试用 AI 帮你实现一些小想法哈，真的很方便！