谷歌插件学习必备准备知识代码提示插件调试

插件开发：全面支持ES6+以上代码，无需编译，原生运行，打包时切忌开启转换ES5语法，原生支持async，await，js本身基因就是协程

插件开发入门课：

基础课：目前没有发现高级课，可能需要我们自己后续读文档看github源码来获取更多关于插件开发的高级用法

建议抽一天时间看完：

Chrome谷歌浏览器插件开发_哔哩哔哩_bilibili

北辰课源代码，按课时进行的feature分支，使用git flow管理更方便

海南酷森科技有限公司/chrome-plugin

猿伙伴的个人空间_哔哩哔哩_Bilibili

Chrome插件开发最牛X系列教程_哔哩哔哩_bilibili 英语有字幕，看起来不费劲，讲的比上面两个更深一些，建议1-2天抽时间看完

谷歌插件开发原生文档

基于V3，市场目前流行的都是V2，建议先看V2，达到熟练运用后，再看V3，当然V3中90%的用法都是相同的，也可以直接参考，但不能以为是相同的

https://developer.chrome.com/docs/extensions/

Jquery中文文档：

jQuery API 中文文档 | jQuery API 中文在线手册 | jquery api 下载 | jquery api chm

Google插件中文文档：

chrome谷歌浏览器开发文档

webstorm安装浏览器插件开发提示库：

安装后chrome就能提示相关插件函数，很好用，大大加快插件开发速度，以及纠错能力

装上好，就可以进行函数提示：大大提高开发效率

pop页面调试技术：直接在pop页面右键检查找到来源

背景页调试：

参考谷歌扩展链接：

https://developer.chrome.com/docs/extensions/mv3/tut_debugging/

content_scripts 脚本调试：

插件脚本的页面进行检查，选择内容脚本，选择插件中的js，点击断点，就可以调试了

v2后台页配置

如果用了persistent:false 可以理解为非常驻背景页，也即数据状态不被保存，每次触发事件时都会重置数据状态，如果设置为persisten:true，则理解为谷歌浏览器打开之后，就会一直在后台运行，数据状态会被保存：

如果触发了一个重要事件，侦听器必须处于顶级以激活后台脚本。注册的侦听器可能需要重构为同步模式。构造侦听器(如下所示)将不允许调用它们，因为它们没有同步注册。

相反，应该将侦听器保持在顶级并且不嵌套。

// 谷歌V2推荐模式，为V3做铺垫和准备
{
  "name": "My extension",
  ...
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  ...
}
// 下面page为谷歌废弃模式，请不要使用，直接使用上面的方式 
{
  "name": "My extension",
  ...
  "background": {
    "page": "background.html",
    "persistent": false
  },
  ...
}

V3技术

背景页中使用alarms警报器来取代setTimeout 和 setInterval，V2版本如果persisten:false 则用setTimeout 和 setInterval 函数没有用，以为过几秒就杀死了，所以如果 V2 想用这两个函数，必须 persistent:true 才可以

chrome.alarms.create({delayInminutes: 3.0});

chrome.alarms.onAlarm.addListener(function(){
  alert("xxxx");
})

// 基于事件驱动的后台脚本函数执行换成异步模式
chrome.runtime.getBackgroundPage(function(backgroundPage){
    backgroundPage.backgroundFunction()
})