Chrome 黑科技，如何在 Chrome DevTools 中运行终端

先来看一张最终效果图：

具体步骤

1. 打开 Chrome DevTools 的实验功能：用 Chrome 打开 chrome://flags/#enable-devtools-experiments（选择开启，而后重启浏览器）；

2. 打开 Chrome DevTools，按 F1 键，选择左侧的 Experiments 标签，而后连续按 7 下 shift 键，在显示出的实验功能中勾选 Terminal in drawer；

3. 而后从右上角的菜单中选择 Terminal，以下：
   

4. 若是提示 Terminal service is not available 请按下面的步骤继续进行。

5. 安装 devtools-backend 工具（须要 node 5.10.0 及以上版本），并运行 devtools-backend 命令。

   npm i -g devtools-backend
   devtools-backend

6. 退出 Chrome，而后在命令行中运行如下命令（Windows 中要修改成 Chrome 的具体路径）打开 Chrome。

   /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --devtools-flags='service-backend=ws://localhost:9022/endpoint'

7. 再次打开 DevTools 的 Terminal，就会看到效果了。

注：默认打开的是 bash，若是安装了 zsh 的话，能够在 Terminal 中运行 zsh 进行切换。还等什么，赶快来体验一下吧。

参考：

• Browser Terminals