Hot Reloading for Chrome Extensions

github.com/xpl/crx-hotreload

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!

Image may be NSFW.
Clik here to view.

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

Hot Reloading for Chrome Extensions

…in Russian @ habrahabr.ru

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

About the author

Check out my other stuff:

👉 LinkedIn: https://linkedin.com/in/xpl/
👉 GitHub: https://github.com/xpl

Image may be NSFW.
Clik here to view.