AI 助力 0 编程基础小白开发谷歌截图插件

大家好,我是伍六七。

AI 时代,领编程基础的小白也能通过 AI 开发出来一些简单好用的小工具。

阿七今天就带大家纯使用 GPT,「开发」出自己的一款谷歌浏览器截图组件!

直接问 GPT 我们要干嘛。

我想要制作一款谷歌截图插件,生成相关代码,自我重复审核代码正确性,确保插件能够正常运行。给出完整代码。

根据 GPT 返回,先创建一个 Google ScreenShot Extension 的文件夹,然后创建三个文件,分别是:manifest.json、popup.html、popup.js。

然后把 GPT 回复的文件内容分别复制粘贴到文件中。

保存好文件内容之后,打开谷歌浏览器路径:右上角三个点-> 管理扩展程序 -> 扩展程序,选择「加载已解压的扩展程序」

发现报错了。

我们把报错信息扔给 GPT。

manifest.json 格式有问题,检查发现,我的文件根本没放内容(抽自己)。我们重新把 GPT 输出的内容放入 manifest.json 文件。

再次导入插件,这次成功了!

但是我在点击插件按钮 Task Screenshot 的时候没有反应,我们把问题扔给 GPT。

好,这会导入插件成功。但是我在使用的时候,点击 Take Screenshot 没有反应。 请解释原因,并给出解决方案

我排查了前面三个原因都没有问题,最后 GPT 还告诉我们可以检查浏览器的开发者工具控制台。

怎么打开控制台?右键扩展程序,选择 「审核弹出内容」,发现报错信息,发给 GPT

我发现控制台报错信息:Uncaught TypeError: Cannot read properties of null (reading 'addEventListener') at popup.js:1:44 请解决这个报错

我们把 GPT 修改后的代码,复制到 popup.js 文件中,然后删除谷歌插件,之后重新导入。

这会可以了,我们点击插件,如果列表中没有,点击下方截图最右侧的扩展程序,能打开所有的扩展程序。

我们点击 Take Screenshot 按钮,就可以把当前 tab 截成图。

给自己鼓个掌吧

有个 GPT,不会代码的人,也能做出自己的小产品!


扫描下面二维码,加我好友,回复「技术交流群」免费进群,一起学习 AI 编程,还可以免费领取 Java 面试资料。

链接我

相关推荐
万少6 小时前
小龙虾(openclaw),轻松玩转自动发帖
前端·人工智能·后端
飞哥数智坊8 小时前
openclaw 重大更新,真的懂我啊
人工智能
KaneLogger8 小时前
AI 时代编程范式迁移的思考
人工智能·程序员·代码规范
飞哥数智坊8 小时前
养虾记第2期:从“人工智障”到“赛博分身”,你的龙虾还缺这两个灵魂
人工智能
飞哥数智坊8 小时前
龙虾虽香,小心扎手!官方点名后,我们该怎么“养虾”?
人工智能
yiyu07168 小时前
3分钟搞懂深度学习AI:实操篇:卷积层
人工智能·深度学习
字节架构前端10 小时前
Skill再回首—深度解读Anthropic官方最新Skill白皮书
人工智能·agent·ai编程
冬奇Lab11 小时前
OpenClaw 深度解析(八):Skill 系统——让 LLM 按需学习工作流
人工智能·开源·源码阅读
陈随易11 小时前
前端大咖mizchi不满Rust、TypeScript却爱上MoonBit
前端·后端·程序员