如何在WebStorm中刷新Chrome？

Question

虽然WebStorm调试器非常强大，但我更喜欢Chrome控制台。我无法使用WebStorm的实时重载功能，因为它是调试器的一项功能，在Chrome控制台打开时将无法正常工作。每次想要刷新都需要手动让Chrome获得焦点，这令人头疼，有没有什么简单的方法可以在不离开WebStorm的情况下触发Chrome中的刷新？

- Pezzer

Answer 1

我是一位有用的助手，可以翻译文本。

我刚好使用Mac电脑，因此能够利用WebStorm的“外部工具”配置和AppleScript找到解决方案。以下是步骤：

在WebStorm中定义一个外部工具配置

• 打开WebStorm偏好设置（⌘,）
• 进入 工具 --> 外部工具
• 创建一个新配置:
  • 点击 '+' 按钮（将会出现一个对话框）
  • 设置名称/描述为所需
  • 取消选中 打开控制台
  • 将 程序 设置为 osascript
  • 将 参数 设置为 -e "tell application \"Google Chrome\"" -e "repeat with theWindow in (windows)" -e "repeat with theTab in (tabs of theWindow)" -e "if theTab's URL contains \"localhost\" then" -e "reload theTab" -e "end if" -e "end repeat" -e "end repeat" -e "end tell"
  • 按下 确定 以保存

此时，您可以进入 工具 --> 外部工具 --> 来刷新所有包含“localhost”URL的Chrome标签页。

你也可以在首选项的 键盘映射 部分映射一个按键组合。

---

供参考，以下是正在执行的AppleScript：

tell application "Google Chrome"
    repeat with theWindow in (windows)
        repeat with theTab in (tabs of theWindow)
            if theTab's URL contains "localhost" then
                reload theTab
            end if
        end repeat
    end repeat
end tell

---

更新:

外部工具配置和绑定键很好，但还有些不足。TypeScript需要时间来编译，因此在保存后，我需要不断地按刷新键，直到看到我的更改... 我真正想要的是Chrome在所有TypeScript编译完成之前等待刷新。这就是我想出来的方法:

通过将npm运行配置的命令设置为version，您可以设置一个运行配置，有效地什么也不做，只调用外部工具（请参见此帖子）。我使用了这种策略，首先创建了一个运行配置，调用Compile TypeScript，然后是我之前定义的Refresh Chrome Tabs脚本。关键在于这些外部工具是按顺序运行的。

为了更进一步，我定义了一个宏，它会“全部保存”然后“运行”，并将⌘S重新绑定到运行调用此宏。现在，每当我保存时，Chrome会在TypeScript编译完成后自动刷新，无需任何额外的按键操作。

- Pezzer

---

很好！这将非常有用！ - captain_jim1