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

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

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

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

这正是AutoIt等软件或替代软件大放异彩的地方。关键是编写一个模拟当前测试阶段的脚本。至少要习惯使用其中的一种，因为许多技术都没有明确的工作流程/测试路径。

Run("c:\Program Files (x86)\Google\Chrome\Application\chrome.exe")
WinWaitActive("New Tab - Google Chrome")
Send("^l")
Send("chrome://extensions{ENTER}")
WinWaitActive("Extensions - Google Chrome")
Send("{TAB}{TAB}{TAB}{TAB}{TAB}{TAB}")
Send("{ENTER}")
WinWaitActive("Extensions - Google Chrome")
Send("{TAB}{TAB}")
Send("{ENTER}")
WinWaitActive("Developer Tools")
Send("^`")

显然，您更改了代码以适应您的测试/迭代需求。确保标签点击是真的锚标签是在chrome://扩展站点。您还可以使用相对于窗口的鼠标移动和其他类似的宏。

我将以类似于下面的方式将脚本添加到Vim:

map <leader>A :w<CR>:!{input autoit loader exe here} "{input script location here}"<CR>

这意味着当我在Vim中，我按下ENTER上面的按钮(通常负责:|和\)，即领导按钮，并跟随一个大写的“a”，它保存并开始我的测试阶段脚本。

请确保填写{input…}节在上面的Vim/热键脚本适当。

许多编辑器允许你用热键做类似的事情。

可以在这里找到AutoIt的替代品。

Windows: AutoHotkey

Linux: xdotool, xbindkeys

Mac: Automator

正如文档中提到的:下面的命令行将重新加载应用程序

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --load-and-launch-app=[path to the app ]

所以我只是创建了一个shell脚本，并从gulp调用该文件。超级简单:

var exec = require('child_process').exec;



gulp.task('reload-chrome-build',function(cb){

console.log("reload");

var cmd="./reloadchrome.sh"

exec(cmd,function (err, stdout, stderr) {
    console.log("done: "+stdout);

    cb(err);
    }
);});

在脚本上运行必要的监视命令，并在需要时调用重载任务。干净,简单。

苹果只

使用扩展Reloader:

使用打印稿

将你的观察者添加到你的项目中:yarn Add tsc-watch 向package.json添加脚本命令

...
  "scripts": {
    "dev": "tsc-watch --onSuccess \"open -a '/Applications/Google Chrome.app' 'http://reload.extensions'\""
  },
...

运行脚本yarn dev

使用JavaScript

将你的watcher添加到你的项目中:yarn Add watch-cli 向package.json添加脚本命令

...
  "scripts": {
    "dev": "watch -p \"**/*.js\" -c \"open -a '/Applications/Google Chrome.app' 'http://reload.extensions'\""
  },
...

运行脚本yarn dev

额外的好处:在Extensions Reloader选项中打开“reload current tab”，这样它就会在做出更改后重新加载:

使用npm init创建一个包。Json在根目录下

NPM install——save-dev gulp-open &&

然后创建gulpfile.js

它看起来像:

/* File: gulpfile.js */

// grab our gulp packages
var gulp  = require('gulp'),
    open = require('gulp-open');

// create a default task and just log a message
gulp.task('default', ['watch']);

// configure which files to watch and what tasks to use on file changes
gulp.task('watch', function() {
  gulp.watch('extensionData/userCode/**/*.js', ['uri']);
});

gulp.task('uri', function(){
  gulp.src(__filename)
  .pipe(open({uri: "http://reload.extensions"}));
});

这适用于我开发CrossRider，你可能会观察改变路径，你看文件在，也假设你有npm和节点安装。

这里有一个函数，您可以使用它来监视文件的更改，并在检测到更改时重新加载。它通过AJAX轮询它们，并通过window.location.reload()重新加载。我想你不应该在分发包中使用这个。

function reloadOnChange(url, checkIntervalMS) {
    if (!window.__watchedFiles) {
        window.__watchedFiles = {};
    }

    (function() {
        var self = arguments.callee;
        var xhr = new XMLHttpRequest();

        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4) {
                if (__watchedFiles[url] &&
                    __watchedFiles[url] != xhr.responseText) {
                    window.location.reload();
                } else {
                    __watchedFiles[url] = xhr.responseText
                    window.setTimeout(self, checkIntervalMS || 1000);
                }
            }
        };

        xhr.open("GET", url, true);
        xhr.send();
    })();
}

reloadOnChange(chrome.extension.getURL('/myscript.js'));