ブラウザからローカルファイルを操作するターミナルを作った
DRANK

フロントエンド開発はフロントエンドで完結すべき過激派としてのGWの活動で、ブラウザでローカルファイルを読み書きするターミナルのプロトを作ってみました。 仕組みFileSystemAccess API を使って、FS API を実装xterm.js 上で FS を叩く Unix 風のコマンドをいくつか実装monaco-editor で、open <file> した内容を渡して、Cmd-S で保存した内容をFSに書き込む最初に開いてるのは navigator.storage.getDirectory() の一時的なストレージで、これはブラウザの機嫌次第で揮発します(仕様にそう書いてある)。ローカルファイルを操作するのに mount を使うのがメインの用途です。FileSystemAccess API が Chrome のみ対応なので、Chrome でしか動きません 基本的な使い方Unix風のコマンド: cd ls cp mkdir rm あたりを実装してあります。同一ディレクトリのものに関しては Tab で補完します。深いパスの補完は、気が向いたら作ります。実装してないもの: , >, * のようなパイプ処理, 標準入出力, glob pattern による列挙は実装途中です。 WebShell 特有のコマンドmount コマンドで指定したディレクトリを /<dirname> にマウントします。open <file> コマンドで組み込みエデ…

zenn.dev
Related Topics:
1 comments