qiqiboy / chrome-extension-development Goto Github PK

 


本项目代码开发环境使用webpack构建，同时使用了webpack-dev-server来创建了一个默认端口3666的本地开发服务器。

开发时所有入口文件均加入了一个hotClient的js（修改自react-dev-utils）。该代码中通过websocket与开发服务器连接，接受代码变动的推送。

当发现代码有变动时，会通过 background 环境，执行下面的动作：

• 查找当前窗口所有tab，是不是有打开的扩展管理页面（chrome://extensions）
• 如果找到该tab，则刷新该tab；否则创建一个固定tab打开扩展管理页面，然后刷新该tab。

扩展管理页面刷新就会自动重载所有的开发状态的tab。借此，就完成了代码变动到扩展重载的功能实现。