Hot Reloading for Chrome Extensions

Finally, someone did it ;)

  1. Drop hot-reload.js to your extension's directory.
  2. Add it to your background scripts section in the manifest.json file:
"background": { "scripts": ["hot-reload.js"] }

After startup, it will watch for file changes in the extension’s directory. When a change detected, it will reload itself, refreshing the active tab (to re-trigger updated content scripts).

And there’s no need to manually de-activate it before publishing, as it disables itself automagically™ in the production configuration!

The script is amazingly simple, everything fits into just ~50 lines of code. Here’s also a blog post explaining the internals:

…in Russian @

P.S. You can also simply clone the GitHub repository and use it as a boilerplate for your extension.