chrome extension development runtime auto reload

This plugin you can call in anywhere not only gulp but also pure node.

you may install this plugin with this command:

npm install crxautoreload --save-dev

Once the plugin has been installed, it may be enabled inside your gulpfile with this line of JavaScript:

var crxAutoReload = require('crxautoreload');


gulp.task('autoreload', function() {
    crxAutoReload({
        extensionDir: "./src"
    });
})

manifest.json

{
    ...
    ,
    "background": {
        "scripts": ["reload.js"] // add 
    },
    ...

}

In the above example, whenever there are changes to the project's Javascript or HTML files the autoreload task kicks off creating a reload.html in the designated extensionDir with just a simple timestamp. Here would be the sample contents of reload.html.

1403936558108

On the first run of autoreload the reload.js will be created in the designated extensionDir. Its job is to check the reload.html file every second to see if the timestamp has changed. If the timestamp has changed a chrome.runtime.reload() will be executed on reload.html. This eliminates the need to go to chrome://extensions and perform a manual refresh.

see the cozhihu project or search keyword generated by crxautoreload in github.

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Gulp.

Inspired by grunt-crx-auto-reload project.

Copyright (c) 2016 Terry Cai. Licensed under the MIT license.