在Chrome中保存对HTML文件的更改时自动重新加载浏览器？
我正在编辑Vim中的HTML文件，我希望浏览器在下面的文件发生更改时进行刷新。
是否有Google Chrome的插件可以监听文件的更改，并在每次保存对文件的更改时自动刷新页面？ 我知道有Firefox的XRefresh，但我不能让XRefresh运行。
写一个脚本自己做这件事有多难？
我假设你不在OSX上？ 否则你可以用applescript做这样的事情：
http://brettterpstra.com/watch-for-file-changes-and-refresh-your-browser-automatically/
还有一个名为“auto refresh plus”的chrome插件，您可以每隔x秒指定一次重新加载：
https://chrome.google.com/webstore/detail/auto-refresh-plus/oilipfekkmncanaajkapbpancpelijih?hl=en
Tincr是一个Chrome扩展，只要下面的文件发生变化就会刷新页面。
纯JavaScript解决scheme！
Live.js
只需将以下内容添加到<head> ：
<script type="text/javascript" src="http://livejs.com/live.js"></script>
怎么样？ 只要包含Live.js，它将通过向服务器发送连续的HEAD请求来监视当前页面，包括本地CSS和Javascript。 CSS的更改将dynamic应用，HTML或Javascript更改将重新加载页面。 尝试一下！
哪里？ Live.js可在Firefox，Chrome，Safari，Opera和IE6 +中运行，除非经过validation。 Live.js独立于您使用的开发框架或语言，无论是Ruby，Handcraft，Python，Django，.NET，Java，Php，Drupal，Joomla还是您所拥有的。
我几乎从这里复制了这个答案，因为我认为这比现在接受的答案更容易和更一般。
http://livereload.com/ – 适用于OS X的本机应用程序，适用于Windows的Alpha版本。 开源https://github.com/livereload/LiveReload2
LivePage Chrome扩展可以很容易地设置为监视本地文件的变化。
方便的Bash单行版OS X，假设你已经安装了fswatch（ brew install fswatch ）。 它会监视任意path/文件，并在发生更改时刷新活动的Chrome选项卡：
fswatch -o ~/path/to/watch | xargs -n1 -I {} osascript -e 'tell application "Google Chrome" to tell the active tab of its first window to reload'
有关fswatch的更多信息，请访问： https ://stackoverflow.com/a/13807906/3510611
有一个叫做Refreschro的os x和Chrome的java应用程序。 它将监视本地文件系统上的一组给定文件，并在检测到更改时重新加载Chrome：
通过在文档中添加一个元标记，您可以指示浏览器按照提供的时间间隔自动重新加载：
<meta http-equiv="refresh" content="3" >
放置在文档头标签中，这个元标签将指示浏览器每三秒刷新一次。
发现这个： http : //net.tutsplus.com/tutorials/other/quick-tip-4-ways-to-auto-refresh-your-browser-when-designing-new-sites/
在Win7 64，Firefox10.0.2和Chrome版本24.0.1312.57米testing第一个选项。 好的解决方法到目前为止。 记得要删除后期制作。
在node.js中，你可以使用gulp.js + gulp-watch（分别是一个任务运行器和一个更改监听器）来连接primus.js（websockets），这样，gulp让浏览器窗口知道它应该刷新，只要html，js等等，改变。 这是操作系统不可知的，我有它在当地的项目工作。
在这里，这个页面是由你的web服务器提供的，而不是作为一个文件从磁盘加载，这实际上更像真实的东西。
这适用于我（在Ubuntu中）：
#!/bin/bash # # Watches the folder or files passed as arguments to the script and when it # detects a change it automatically refreshes the current selected Chrome tab or # window. # # Usage: # ./chrome-refresher.sh /folder/to/watch TIME_FORMAT='%F %H:%M' OUTPUT_FORMAT='%T Event(s): %e fired for file: %w. Refreshing.' while inotifywait --exclude '.+\.swp$' -e modify -q \ -r --timefmt "${TIME_FORMAT}" --format "${OUTPUT_FORMAT}" "$@"; do xdotool search --onlyvisible --class chromium windowactivate --sync key F5 \ search --onlyvisible --class gnome-terminal windowactivate done
您可能需要安装inotify和xdotool软件包（在Ubuntu中使用sudo apt-get install inotify-tools xdotool ），并将sudo apt-get install inotify-tools xdotool参数更改为您的首选浏览器和terminal的实际名称。
按照描述启动脚本，只需在浏览器中打开index.html。 每次在vim中保存后，脚本将会集中浏览器的窗口，刷新它，然后返回到terminal。
我find的最灵活的解决scheme是与防护服务器配对的Chrome LiveReload扩展 。
观看一个项目中的所有文件，或者只有您指定的文件。 这里是一个Guardfileconfiguration示例：
guard 'livereload' do watch(%r{.*\.(css|js|html|markdown|md|yml)}) end
缺点是你必须设置每个项目，这有助于如果你熟悉的ruby。
我也使用了Tincr chrome扩展 – 但它似乎与框架和文件结构紧密相连。 （我尝试为一个jekyll项目configurationtincr，但它只允许我观察一个文件的变化，不包括包括，部分或布局的变化）。 然而，Tincr的工作方式非常棒，它具有一致和预定义的文件结构。
如果Tincr允许所有包含匹配模式进行重新加载，这将是一个很好的解决scheme，但是该项目的function集仍然有限。
这可以使用一个简单的Python脚本来完成。
- 使用pyinotify来监视一个特定的文件夹。
- 使用启用了debugging的Chrome。 刷新可以通过websocket连接完成。
完整的细节可以参考这里 。
安装并设置chromix
现在将其添加到您的.vimrc
autocmd BufWritePost *.html,*.js,*.css :silent ! chromix with http://localhost:4500/ reload
将端口更改为您使用的端口
使用Gulp观看文件和Browsersync重新加载浏览器。
步骤是：
在命令行执行
npm install –save-dev gulp浏览器同步
使用以下内容创buildgulpfile.js ：
var gulp = require('gulp'); var browserSync = require('browser-sync').create(); var reload = browserSync.reload; gulp.task('serve', function() { browserSync.init({ server: { baseDir: "./" } }); gulp.watch("*.html").on("change", reload); });
跑
吞噬服务
编辑HTML，保存并查看您的浏览器重新加载。 神奇的function是通过在您的HTML文件中快速注入特殊的标签。
根据attekei对OSX的回答：
$ brew install fswatch
查找所有这到reload.scpt ：
function run(argv) { if (argv.length < 1) { console.log("Please supply a (partial) URL to reload"); return; } console.log("Trying to reload: " + argv[0]); let a = Application("Google Chrome"); for (let i = 0; i < a.windows.length; i++) { let win = a.windows[i]; for (let j = 0; j < win.tabs.length; j++) { let tab = win.tabs[j]; if (tab.url().startsWith("file://") && tab.url().endsWith(argv[0])) { console.log("Reloading URL: " + tab.url()); tab.reload(); return; } } } console.log("Tab not found."); }
这将重新加载第一个标签，它发现以file://开头，并以第一个命令行参数结束。 你可以根据需要调整它。
最后，做这样的事情。
fswatch -o ~/path/to/watch | xargs -n1 osascript -l JavaScript reload.scpt myindex.html
fswatch -o输出每个更改事件中已更改的文件数，每行一个。 通常它只会打印1 。 xargs读取这些内容， -n1表示它将每一个作为parameter passing给osascript的新执行（它将被忽略）。
pip install https://github.com/joh/when-changed/archive/master.zip alias watch_refresh_chrome=" when-changed -v -r -1 -s ./ osascript -e 'tell application \"Google Chrome\" to tell the active tab of its first window to reload' "
那么只要进入你要监视的目录执行“watch_refresh_chrome”
