mozilla的家伙们刚刚发布了一个新的https://github.com/mozilla/web-ext，你可以用它来启动web-ext运行——target chromium

另一个解决方案是创建自定义liverload脚本(extension-reload.js):

// Reload client for Chrome Apps & Extensions.
// The reload client has a compatibility with livereload.
// WARNING: only supports reload command.

var LIVERELOAD_HOST = 'localhost:';
var LIVERELOAD_PORT = 35729;
var connection = new WebSocket('ws://' + LIVERELOAD_HOST + LIVERELOAD_PORT + '/livereload');

connection.onerror = function (error) {
  console.log('reload connection got error:', error);
};

connection.onmessage = function (e) {
  if (e.data) {
    var data = JSON.parse(e.data);
    if (data && data.command === 'reload') {
      chrome.runtime.reload();
    }
  }
};

这个脚本使用websockets连接到liverload服务器。然后，它会在重载消息时发出一个chromium .runtime.reload()调用。下一步是将该脚本添加到清单中作为后台脚本运行。Json，瞧!

注意:这不是我的解决方案。我只是把它发布出来。我在Chrome扩展生成器(伟大的工具!)的生成代码中发现它。我把这个贴在这里，因为它可能有帮助。

mozilla的家伙们刚刚发布了一个新的https://github.com/mozilla/web-ext，你可以用它来启动web-ext运行——target chromium

我已经做了一个简单的可嵌入脚本热重载:

https://github.com/xpl/crx-hotreload

它监视扩展名目录中的文件更改。当检测到更改时，它重新加载扩展并刷新活动选项卡(以重新触发更新的内容脚本)。

通过检查文件的时间戳来工作 支持嵌套目录 在生产配置中自动禁用自身

刚刚发现了一个新的基于grunt的项目，它提供了引导，脚手架，一些自动预处理功能，以及自动重新加载(不需要交互)。

从Websecurify引导您的Chrome扩展

博士TL;

创建一个WebSocket服务器，该服务器将消息分派给后台脚本，以处理更新。如果你正在使用webpack，不打算自己做，webpack-run-chrome-extension可以帮助你。

回答

您可以创建一个WebSocket服务器来作为WebSocket客户端与扩展通信(通过窗口对象)。然后，扩展将通过将WebSocket服务器附加到一些侦听器机制(如webpack devServer)来侦听文件更改。

文件改变了吗?设置服务器向扩展发送请求更新的消息(将ws消息广播到客户机)。扩展然后重新加载，回复“ok，重新加载”，并保持监听新的变化。

Plan

设置WebSocket服务器(用于分发更新请求) 找一个可以告诉你文件什么时候改变的服务(webpack/其他捆绑软件) 当发生更新时，向客户端发送请求更新的消息 设置WebSocket客户端(接收更新请求) 重新加载扩展

How

对于WebSocket服务器，使用ws。对于文件更改，使用一些监听器/钩子(如webpack的watchRun钩子)。对于客户端部分，使用本地WebSocket。然后扩展可以将WebSocket客户端附加到后台脚本上，以保持服务器(由webpack托管)和客户端(附加在扩展后台的脚本)之间的持久同步。

现在，为了让扩展重新加载自己，你可以在每次上传请求消息来自服务器时调用chrome.runtime.reload()，或者甚至创建一个“重新加载扩展”来为你做这件事，使用chrome.management.setEnabled()(需要“权限”:["management"]在清单中)。

在理想的情况下，像webpack-dev-server这样的工具或任何其他web服务器软件都可以提供对chrome扩展url的本地支持。在此之前，使用服务器代理扩展名的文件更改似乎是目前为止的最佳选择。

可用的开源替代方案

如果你正在使用webpack并且不想自己创建它，我做了webpack-run-chrome-extension，它做了我上面计划的。