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

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

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服务器

Chrome扩展有一个权限系统，它不会允许它(一些人在SO有同样的问题)，所以要求他们“添加这个功能”是不会工作的IMO。有一封来自Chromium Extensions谷歌Groups的邮件，其中提出了一个使用Chromium .extension. getviews()的解决方案(理论)，但也不能保证工作。

是否可以加到清单上。json一些Chrome内部页面，如Chrome://extensions/，这将有可能创建一个插件，将与Reload锚交互，并使用外部程序，如XRefresh(一个Firefox插件-有一个Chrome版本使用Ruby和WebSocket)，你将实现你所需要的:

XRefresh是一个浏览器插件 是否会刷新当前网页 所选文件夹中的文件更改。这 使它有可能做活页 使用您最喜欢的HTML/CSS编辑 编辑器。

这是不可能做到的，但我认为你可以用不同的方式来使用这个概念。

您可以尝试找到第三方解决方案，而不是，在看到文件中的修改后(我不知道emacs也不知道Textmate，但在emacs中可以绑定一个应用程序调用“保存文件”动作)，只需单击特定应用程序的特定坐标:在这种情况下，它是从您的扩展在开发中的重新加载锚(您留下一个Chrome窗口打开只是为了重新加载)。

(疯狂至极，但可能管用)

免责声明:我自己开发了这个扩展。

职员- Chrome Live扩展重新加载客户端

连接到与liverload兼容的服务器，每次保存时自动重新加载扩展。 额外的好处:在你的部分有一点额外的工作，你也可以自动重新加载你的扩展改变的网页。

大多数网页开发人员使用带有某种监控器的构建系统，该系统自动构建文件并重新启动服务器并重新加载网站。

开发扩展不应该有那么大的不同。Clerc为Chrome开发者带来了同样的自动化。使用liverload服务器设置一个构建系统，Clerc将侦听重新加载事件以刷新扩展。

唯一的大问题是对manifest.json的更改。清单中的任何微小的拼写错误都可能导致进一步的重新加载尝试失败，并且您将被卡住卸载/重新安装扩展以再次加载更改。

在重新加载之后，Clerc将完整的重新加载消息转发给您的扩展，因此您可以选择使用提供的消息来触发进一步的刷新步骤。

如果你有一台Mac，最简单的方法就是使用Alfred App!

只需使用Powerpack获取Alfred App，然后添加下面链接中提供的工作流，并自定义你想要的热键(我喜欢使用⌘+ + R)。

现在，每次你使用热键，谷歌Chrome浏览器将重新加载，无论你在那个时刻的应用程序。

如果你想使用其他浏览器，打开AppleScript在阿尔弗雷德首选工作流程和替换“谷歌Chrome”与“Firefox”，“Safari”，…

我还将在这里显示在ReloadChrome中使用的/usr/bin/osascript脚本的内容。Alfredworkflow文件，这样你就可以看到它在做什么。

tell application "Google Chrome"
  activate
  delay 0.5
  tell application "System Events" to keystroke "r" using command down
  delay 0.5
  tell application "System Events" to keystroke tab using command down
end tell

工作流文件为ReloadChrome.alfredworkflow。

苹果只

使用扩展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”，这样它就会在做出更改后重新加载: