Question

如何开发chrome插件？

Answer 1

chrome作为前端开发的标准浏览器，拥有强大的功能，其中chrome插件就其中非常有用的工具！作为一名前端，开发一款好用的chrome插件也是一件非常有成就感的事！下面我就简单叙述一下如何开发！

1、一个简单的二维码插件目录，核心文件manifest.json，以下简称清单文件，这个文件是必须有的，其余的html、js、css、img等就根据需要来创建就可以了。

2、manifest.json介绍

必须配置的字段、以及常用的配置字段

defalut_popup必须指定html文件，另外html内不允许内联js（inlinejavascript），插件的开发和普通web开发是一样的，都是用html、js、css。除此之外扩展还提供很多强大的api，帮助我们丰富浏览器的扩展功能。

3、常用APIchrome.tabschrome.runtime可以监听和响应扩展生命周期的事件chrome.webRequestchrome.windowchrome.storagechrome.contextMenuschrome.devtoolschrome.extension

使用大多数的api要声明权限的,因为js中使用chromeAPI，所以示例中在permissions这个字段设置了tabs。

当然，清单的配置远不止这些，随着功能的强大，会看到更多的字段。

/extensions/manifest

4、代码编写完成后，打开扩展的界面，chrome://extensions.，勾选开发者模式，点击‘已解压的扩展程序’，选择开发好的文件夹，这样就成功添加上了扩展。

5、调试

示例中，扩展功能界面是以弹窗形式展示，点击图标，右键审查元素即可。

6、打包与发布登录chrome应用商店/webstore/developer/dashboard/点击进去开发者信息中心添加压缩后的zip包按提示添加必填的信息，发布即可