Faster Chrome extension development cycle

2 min readbrowser extensions

Here is how developing chrome extension works out of the box:

  1. make a change
  2. open "extensions" page
  3. find your extension there
  4. hit reload
  5. test the change

Steps 2,3,4 really should not be there. Doing this over an over again just makes me want to stop writing software and get into baby clothes instead.

Turns out I am not the only one to feel that pain. There is an Extenstion Reloader extension that, if combined with Guard, automates those steps.

There is a bit of setup. But really is just a bit, assuming you've got a ruby interpreter and a terminal. It works on OSX and, with minor adjustments, on Linux. Not sure about Windows.

Install guard-shell gem:

gem install guard-shell

Add Guardfile to the root of your project with the following contents:

guard :shell do watch /(js|css|html|json)$/ do `open -g http://reload.extensions` end end

In a terminal, cd into project folder and run guard.

That is it. From now on, while guard is running, changing any file inside your project will result into extensions reload in a background.

One caveat though, looks like Extension Reloader does not reload changes in manifest. Other than that, you got it!