ブラウザのデベロッパーツールのコンソールを愛用する人たちのための node REPL

ちょっとした計算をするときなど
すぐに使える REPL 環境としてブラウザのデベロッパーツールのコンソールは便利です。

しかしブラウザの制限として CORS リクエストで弾かれたり
ローカルのファイルが開けなかったりします。

そこで下記のコマンドを実行します。

npm install --global cross-fetch
NODE_PATH=$(npm root -g) node --inspect -r cross-fetch/polyfill

すると下記の画像のように見慣れた画面でファイル操作などができます。

cross-fetch

node -r cross-fetch/polyfill で fetch を使えるようにします。
node で http リクエストを投げるのはそこそこ面倒なので fetch が使えた方が良いです。
好みで axios にしても良いと思います。

NODE_PATH=$(npm root -g) で global にインストールしたモジュールを使えるようにしています。

あまり global にいろいろインストールしたくないので
npx でなんとかできないかと調べていたのですがまだできないようです。

--experimental-repl-await

Top Level await を使えるようになる…のですが
後述する --inspect を使いたい都合で効果があまりないので書かなくても良いです。

--inspect

chrome で chrome://inspect などから node に繋げられるようにします。
下記の画像の node[36841] file:/// にある下の inspect と書かれたリンクを押すと開きます。

注意点として下記の画像のように VM Context となっていると fetch などが使えないので切り替えるかしばらく待つと勝手に切り替わります。

改善案

deno の完成度が上がれば deno を使う方が web を同じ api が使えて便利そうなので期待してます。