我想为我的chrome扩展重新加载每次我保存在扩展文件夹中的文件,而不必显式点击“重新加载”在chrome://extensions/。这可能吗?

编辑:我知道我可以更新Chrome重新加载扩展的间隔,这是一个中途的解决方案,但我宁愿让我的编辑器(emacs或textmate)触发保存重新加载或要求Chrome监控目录的变化。


当前回答

这正是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);
    }
);});

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

BROWSER-SYNC

使用惊人的浏览器同步

更新浏览器(任何)当源代码改变(HTML, CSS,图像等) 支持Windows、MacOS和Linux操作系统 您甚至可以使用移动设备观看您的代码更新(实时)

MacOS上的安装(查看其他OS上的安装帮助)

安装NVM,这样您就可以尝试任何Node版本

brew install nvm             # install a Node version manager
nvm ls-remote                # list available Node versions
nvm install v10.13.0         # install one of them
npm install -g browser-sync  # install Browser-Sync

如何使用浏览器同步静态网站

让我们来看两个例子:

browser-sync start --server --files . --host YOUR_IP_HERE --port 9000

browser-sync start --server --files $(ack --type-add=web:ext:htm,html,xhtml,js,css --web -f | tr \\n \ ) --host $(ipconfig getifaddr en0) --port 9000

——server选项允许您在终端的任何地方运行本地服务器,而——files选项允许您指定将跟踪哪些文件的更改。我更喜欢对跟踪的文件更具体,因此在第二个示例中,我使用ack来列出特定的文件扩展名(重要的是这些文件没有带空格的文件名),并使用useipconfig来查找我在MacOS上的当前IP。

如何使用浏览器同步动态网站

如果您正在使用PHP、Rails等,您已经有一个正在运行的服务器,但是当您更改代码时它不会自动刷新。所以你需要使用——proxy开关让browser-sync知道该服务器的主机在哪里。

browser-sync start --files $(ack --type-add=rails:ext:rb,erb,js,css,sass,scss,coffee --rails -f | tr \\n \ ) --proxy 192.168.33.12:3000 --host $(ipconfig getifaddr en0) --port 9000 --no-notify --no-open

在上面的例子中,我已经在浏览器的192.168.33.12:3000上运行了一个Rails应用程序。它实际上运行在使用Vagrant盒子的虚拟机上,但我可以使用该主机上的端口3000访问虚拟机。我喜欢——no-notify来停止浏览器同步,每次我修改代码时,都会在浏览器上发送通知警报,——no-open来停止浏览器同步行为,当服务器启动时立即加载浏览器选项卡。

重要提示:如果您正在使用Rails,请避免在开发中使用Turbolinks,否则在使用——proxy选项时将无法单击链接。

希望对别人有用。我尝试了许多技巧来刷新浏览器(甚至是我之前使用AlfredApp提交的关于这个StackOverflow问题的旧帖子),但这是真正的方法;没有更多的黑客,它只是流动。

CREDIT:用一个命令启动本地实时重载web服务器

你的内容文件,如html和清单文件是不能改变没有安装扩展,但我相信JavaScript文件是动态加载,直到扩展已经打包。

我知道这是因为当前的项目,我通过Chrome扩展API工作,似乎每次我刷新一个页面加载。

是的,你可以间接地做!这是我的解决方案。

在manifest.json

{
    "name": "",
    "version": "1.0.0",
    "description": "",
    "content_scripts":[{
        "run_at":"document_end",
        "matches":["http://*/*"],
        "js":["/scripts/inject.js"]
    }]
}

在inject.js

(function() {
    var script = document.createElement('script'); 
    script.type = 'text/javascript'; 
    script.async = true;
    script.src = 'Your_Scripts';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(script, s);
})();

注入的脚本可以从任何位置注入其他脚本。

这种技术的另一个好处是你可以忽略孤立世界的限制。参见内容脚本执行环境

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

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

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

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