
传统方式开发开发
谷歌浏览器插件在一开始就被设计为易于开发的工具,吸引更多的开发者和业余代码玩家来参与整个谷歌浏览器插件的生态。谷歌浏览器插件基于Web,所以开发它,相对于传统的客户端软件,要容易得多。技术上的功能构建不是难题,难题在于创意和工具的实用性。
传统方式开发谷歌浏览器插件通常涉及手动编写代码及文件结构,需要理解Chrome扩展机制与核心技术(HTML、CSS、JavaScript、manifest.json)。你需要创建插件文件夹,用于存放所有扩展文件,然后编写manifest.json文件,之后你需要编写页面和脚本文件,如popup.html、popup.js、background.js、content_script.js等,实现具体的功能逻辑。
然后你还需要为你的插件绘制一个图标。之后你就可以用浏览器打开 chrome://extensions/,启用“开发者模式”,点击“加载已解压的扩展程序”,选择插件文件夹。如果你写的插件出现了错误,你可能需要用 Chrome Developer Tools 进行更多的调试。
如果你需要具体的教程,你可以在这里找到:https://developer.chrome.com/docs/extensions
使用AI来开发谷歌浏览器插件
我记得在很多年前,如果我们要开发谷歌浏览器插件,我们首先要具备HTML、JS的基础知识,然后一边调试程序,一边查询API文档,我们通常会使用Firebug或Fiddler作为开发工具。虽然开发谷歌浏览器插件是一件让人愉快的事,但这个过程仍然充满了挑战。
而现在,太多的AI助手能够帮我们快速开发谷歌浏览器插件,比如Cursor、CodeBuddy等,我们可以直接用自然语言描述需求,AI助手可帮你自动生成基本的文件结构和核心代码。比如:“帮我做个网页时间管理插件,要求能计时。”AI不仅能把manifest.json、popup.html、popup.js通通按模块生成,还能一条条给出代码解释,甚至自动补全注释。
我听说有人只用了5分钟,就使用AI助手开发了一个文本自动管理插件,我一点也不吃惊,因为这就是新的AI时代的变化。
图标呢?哦,这也不是问题,我们不再需要自己去绘制,或者找会画画的朋友帮忙了,因为有更多的绘画类的AI助手可以帮你的忙,不是吗?
以Cursor为例子,我们只需要按照以下步骤,就可以轻松的快速开发一个谷歌浏览器插件。
首先,你需要新建项目文件夹,然后把文件夹添加到Cursor的工作区。
然后按Ctrl+I(Mac用Command+I),打开Composer对话框,用自然语言描述插件需求。例如:“帮我开发一个Chrome插件,可以统计当前网页的总字数,点图标弹窗显示出现最多的10个单词”.
Cursor将会自动生成核心文件的结构,包括代码和说明。
然后你可以上传你的ICON文件作为图标使用。
最后你只需要注册一个Chrome应用商店开发者账号,将插件包上传审核即可。
我们唯一的问题在于,是否给予AI助手足够精确的提示词。如果是模糊不清的需求,AI助手可能无法正确理解我们的功能需求和功能逻辑,从而给你制造一个谁也看不懂的东西,所以目前来说,提示词是如此的重要,它是你和AI助手之间最重要的桥梁。
原创文章,作者:猫捉,如若转载,请注明出处:https://www.meowzo.com/developing-google-chrome-extensions-with-ai/
评论列表(1条)
[…] 谷歌浏览器插件的市场也是一个蓬勃发展的市场,每天都有数以千计的新的插件被提交到Chrome网上应用商店。它有些像App Store,但开发的门槛却要低很多,目前使用AI来开发谷歌浏览器插件也很流行,即使不会代码,也可以尝试开发自己想要的浏览器插件。 […]