用什么工具开发chrome插件
发布网友
发布时间：2022-04-24 06:32
我来回答
共1个回答
热心网友
时间：2022-06-16 23:18
创建一个单独的文件夹，起个名字，比如说我们为百度贴吧开发一个插件，就叫TiebaAddion。之后在这个文件夹里创建一个名字为“manifest.json”的文件，在里面写上如下的样子。
{
"name": "TiebaAddin",
"version": "1.0",
"description": "An addin for Tieba.",
"browser_action": {"default_icon": "icon.png"},
"permissions": [http://*/*]
}
这里各项的意义很显然可以通过名字得之，
接着你需要找一个图标，放在这个目录下，名字叫icon.png，当然，这个名字只要和上面的配置文件里default_icon的属性一致就好。
现在，只要点击Chrome工具条的菜单按钮选择里面的工具（Tools）>> 扩展（Extensions）就好。
选择开发者模式，选择加载未打包的插件，然后，选择第一步中的那个文件夹即可。接着启动插件。
在地址栏的右侧出现了图标，但是点击图标却什么也没做，这是自然地，因为我们还什么代码没有写。现在在那个目录下，建立一个html文件，并且名字为popup.html，同时在配置文件里“browser_action”下加上一条："popup": "popup.html"。示范：
{
"name": "TiebaAddin",
"version": "1.0",
"description": "An addin for Tieba.",
"browser_action": {"default_icon": "icon.png"，"popup": "popup.html"},
"permissions": [http://*/*]
}
此处注意，每一对大括号里的最后一项后面都没有逗号，其余的每项之间必须用逗号间隔！哪怕是browser_action这样复合的项目，在他的大括号后也要有逗号。
在Popup.html里写上一些html代码，比如简单的输出HelloWorld也好，这个Popup.html和普通的html文件按没有任何差别。
7
这就是基本的插件制作方法了。
Chrome插件:Postman-API 开发与测试的首选工具
对于API开发和测试的能手来说，Chrome插件Postman无疑是最优选择。这个工具就像魔法般提升效率，特别适合开发者、测试者和API交互的需求者。Postman并非其名所暗示的邮件工具，而是一款专为API设计的神器。在Chrome平台上，它的表现堪称卓越。它的核心功能包括:轻松发送和接收各类HTTP请求，如GET、POST，甚至P...
aippt自动生成工具
随着AI技术的飞速发展，如今市面上涌现了许多实用易操作的AI生成工具1、简介：AiPPT: 这款AI工具智能理解用户输入的主题，提供“AI智能生成”和“导入本地大纲”的选项，生成的PPT内容丰富多样，可自由编辑和添加元素，图表类型包括柱状图、条形...
...Less、Pinia、Naive-ui 开发 Chrome V3 插件
首先，通过Vite创建基础的Vue项目，选择Vue和TypeScript作为开发工具。接着，对项目进行修改，添加Chrome插件所需的manifest.json、service-worker、content和popup页面等配置。配置过程中，包括安装chrome-types包，设置Typescript类型，以及调整vite.config.ts以支持manifest.json配置和文件复制。构建项目时，通过...
微软发布Edge浏览器Chrome插件扩展转制工具
微软今天正式发布了Edge浏览器Chrome插件转制工具Microsoft Edge Extension Toolkit。程序员可以使用Microsoft Edge Extension Toolkit快速的将目前的Chrome浏览器插件转换成适用于Edge浏览器的版本，转换工具自身会对插件进行解析，并给出调试建议。而且，Microsoft Edge Extension Toolkit完全免费，开发者可以到Windows...
新手怎样开发一个谷歌浏览器的插件
Chrome浏览器 文本编辑工具，普通的记事本也可以，不过最好是带格式整理和语法高亮的，笔者用的是Notepad++，需要的朋友可以百度一下。步骤/方法 创建一个单独的文件夹，起个名字吧，比如说我们为百度贴吧开发一个插件，就叫TiebaAddion。之后在这个文件夹里创建一个名字为“manifest.json”的文件，在里面...
Chrome扩展开发攻略:Chrome扩展插件是如何开发的?
浏览器扩展WebExtensions扩展的能力提升或补充网站的功能，比如稀土掘金为各位开发者提供的工具插件，提供包括记笔记等功能。操控网页内容，诸如去除页面广告类扩展。添加开发工具，有Vue和React的devTools，以及前端较为广泛使用的FeHelper。为网页注入脚本，有用户脚本管理工具Tampermonkey。扩展中的文件.├──...
2023金秋版:基于Vite4+React的Chrome插件开发教程
随着2023年的到来，Chrome插件开发的格局正在发生变化。Manifest V2的退出历史舞台，促使开发者转向更为先进的Manifest V3（MV3）。本系列教程将专注于基于Vite 4 + React的Chrome插件开发，以帮助你更高效地进行项目构建。相较于过去的教程，我们不再依赖Create-React-App，而是推荐使用Vite作为基础架构。
2023 年 9 月最新油猴脚本和浏览器扩展插件神器来了
字节跳动旗下机器翻译品牌火山翻译开发的多语言翻译插件 chrome.google.com/webst...，支持网页一键翻译、划词翻译、英语词典、生词本、吐司弹词记忆等功能。还提供网页版 translate.volcengine.com shareclaude 这个插件可以方便的分享claude会话 chrome.google.com/webst...生成效果：语雀剪藏 这个扩展可以...
如何启用第三方Chrome插件
使用开发者模式：在Chrome扩展管理页面，勾选开发者模式。然后浏览第三方扩展文件夹（未打包），或者将第三方扩展安装包crx格式，拖进去安装即可 以开发者模块安装插件，都是可以安装成功的。插件(Plug-in,又称addin、add-in、addon或add-on,又译外挂)是一种遵循一定规范的应用程序接口编写出来的程序。其...
电脑中如何在360极速浏览器安装谷歌Chrome浏览器插件
1. 打开360极速浏览器，点击右上角的菜单图标（三个点）。2. 在菜单中选择“更多工具”，然后选择“扩展程序”。3. 在打开的扩展程序页面的右上角，找到一个开关按钮，将其切换到“开启开发者模式”。4. 打开Chrome浏览器的插件商店（https://chrome.google.com/webstore/category/extensions）。5....
电脑端Chrome浏览器如何使用插件
步骤 1. 首先，我们在电脑中打开chrome浏览器，进入主界面之后我们点击右上方 的三点图标，在下拉的窗口中我们点击“更多工具”-“扩展程序”。2. 然后就会打开扩展程序窗口了。在该窗口中我们即可查看到所有插件以及简介了。3. 我们将右上方 的“开发者模式”开关打开的话，即可显示出更多的功能。4....
