chrome扩展开发总体流程如下：
1. 新建文件夹，并在其中添加所需的所有文件。
2. 将chrome扩展程序管理页面打开，开启开发者模式，然后点击“加载已解压的扩展程序”，选择1中新建的文件夹。这样扩展便会运行，即可进行调试。当修改了扩展中的文件后，可以点扩展程序中的刷新按钮，或者关闭扩展再打开，或者重启浏览器，都可以更新扩展。
3. 将chrome扩展程序管理页面打开，点击“打包扩展程序”，选择1中的文件夹，会自动生成扩展文件crx和密钥文件pem。
开发过程中，主要针对前两步：
一． 扩展所需文件
manifest.json是必须的，这是扩展的配置文件，在该文件中定义了扩展所需要的各种资源和设置。
至少有1个图标，格式推荐png。
其他的html，js，css等文件根据manifest.json的配置来添加。
manifest.json必须放在根目录下，其他文件路径和文件名随意，只要manifest.json中可以对应起来即可。
例如，推荐的一个结构：
根目录下是manifest.json文件，其他文件放在各自对应的文件夹下。
二． 扩展调试开发
针对上图的结构，manifest.json如下：
{
// 必须字段
"name": "Plugin Template",
"version": "1.0",
"manifest_version": 2,
// 建议字段
"description": "This is atemplate.",
"icons": {
"16": "image/icon-16.png",
"48": "image/icon-48.png",
"128": "image/icon-128.png"
},
// 可选
"browser_action": {
"default_icon": "image/icon-128.png",
"default_title": "My Test Template",
"default_popup": "html/browser.html"
},
// 自定义
"permissions": [
"*://www.baidu.com/*",
"background",
"tabs"
],
"background": {
"scripts": [
"lib/jquery-3.3.1.min.js",
"js/background.js"
],
"page": "html/background.html"
},
"content_scripts": [
{
"matches": [
"*://www.baidu.com/*"
],
"js": [
"lib/jquery-3.3.1.min.js",
"js/content.js"
]
}
]
}
实际开发中，根据需要来配置manifest.json。如上：
1. 需要使用地址栏右侧图标，且需要点击后弹出气泡界面，于是使用browser_action，且设置其图标，标题，与弹出的界面页。
2. 需要对浏览器的tabs进行操作，故需使用background环境，于是设置background。要启用background环境的js和页面，于是设置scripts和page属性。
3. 需要对web页面进行修改，故需使用content_scripts进行js注入，但仅需要注入js，不需要注入css，所以这里只配置js。希望在js中使用jquery库，所以将jquery库放在前面。希望该扩展只对百度生效，故配置matches，令其只匹配百度的URL。
4. 根据上面的需求，设置permissions，提供对应的权限。