この記事は、2017年09月03日に投稿された、@daiki7noheさんの記事
「Vagrant上のファイルをVScodeで編集 for Mac」
https://qiita.com/daiki7nohe/items/714c0c122f6ca7586f3b
当該記事で省かれている部分の補記を主な目的としています。読者対象は初学者です。
なお、この記事の内容を実装、実行するにあたりましては某雑食系サロンの方々にご協力とアドバイスを賜りました。
この場をお借りして改めてお礼申し上げます。ありがとうございました。
さて、私は現在ドットインストールで学んでいる初学者です。
ドットインストール側はATOMエディタを推奨しているのですが、私はATOMは動作が重たくて嫌いなので、VSCodeを使っています。
ドットインストール（の教え方）はVagrant＋VirtualBoxで用意した学習用環境を用います。
仮想マシンをターミナルで立ち上げて仮想サーバーにログインし、
サーバー上にファイルを作って、そのファイルをFTPソフトのCyberduckを使って開き、その状態を前提に講義を進めています。
一応この状態（Cyberduck経由で編集ファイルを開く、という状態）でも学習に問題はないわけですが、窓が多くなるデメリットがあります。
VSCodeはそのアプリのそのものの中に統合ターミナルを内包していて、わざわざ別窓でターミナルを開かずとも
VSCode上のターミナルからCodeコマンドに続いてファイル名を叩く事で
スマートにVSCodeでファイルを起動出来る（Vimのファイル起動と同じ方式が可能である事が）一つのウリになっていまして
これが実現できれば窓を切り替えずともスムーズに作業ができます。
参考資料：
これさえあれば大丈夫！Visual Studio Code 徹底解説！ -HTML5 Conference 2017- https://youtu.be/2eIjRYuX5bE
実際、「仮想マシン上以外」であれば何の問題もなく起動できます。
ところがVagrantで立ち上げた仮想サーバー上では、該当記事の処理をしないと「コマンドがみつかりません」となり立ち上げられません。
参考資料２：Vagrant上のファイルをVScodeで編集 for Mac https://qiita.com/daiki7nohe/items/714c0c122f6ca7586f3b #Qiita
解決策をググって、Qiitaのこの記事（冒頭にあげた記事）にはたどり着いたのですが、
「VSCode設定ファイルを編集」の所で詰まってしまいました。
上記記事には設定テキストファイルに何やらポート番号のようなものとサーバー上でVSCodeを起動するかどうかの設定をtrueにするといったような項目を
書き加えろと書いてありますが、実際にCode > 基本設定 > 設定と辿ってみると設定テキストファイルが開くわけではなくGUIベースの入力画面になっており、設定を書き加える場所が出てきません。項目も多岐に渡っており、どこをどうイジればいいのか全く解りませんでした。
この時点でサロンの方のアドバイスを仰ぎました。
要はこの作業は「「setting.json」という設定ファイルを立ち上げる」という作業なのですが、
その設定ファイルは画面右上の {} ボタンから起動できるようです。
罠ですよね、地味に。Code>基本設定＞設定 から設定一覧を起動したときにしか出てこないんだから、このボタン。
解るかー！って叫びましたけど（苦笑）、まあ仕様なので致し方ない。
引き続いて記事に従って設定をしていきます。
VSCodeサーバー起動
F1キーを押して、「Remote: Start server」と検索してEnterでサーバーを起動します。
するとエディタ左下に「Starting server」と表示されます。
「F1キーを」とだけ簡潔に書かれていますが、これはコマンドパレット起動の動作です。
この記事が書かれた以降に仕様が変わったのか解りませんが、無反応でした。
Macでコマンドパレットを起動するには⌘（コマンドキー）＋Shiftキー＋Pキーを押します。
初期状態で入力バーに > が入っていますが、そのままの状態で「Remote: Start server」と書き添えないとうまく動かないようです。
「>」 を消しては駄目だということです。
SSH接続
VSCode上で表示 > 統合ターミナル(またはControl + `)でターミナルを開きます。
そこで、
$ ssh -R 52698:127.0.0.1:52698 vagrant@192.168.33.10
でSSH接続できます。
こうサラッと書いてありますが、これを実行するとログインパスワードを求められます。
パスワードなんて設定した記憶がないのにどうして？って戸惑いました。
サロンの方に頂いたアドバイスに拠れば、vagrant上でこういう場合の初期設定パスワードは半角英字で vagrant だそうです。
実際その通りにしてログインし、後は記事通りに設定を進めた結果、vagrantの仮想サーバー上でも
VScodeをターミナルコマンドでが通るようになりました。
（Codeコマンドではありませんのですが、目的はともかく達成できたのでこれで良しとします）
なお、今回問題はこれにて解決しましたが、以下のようなアドバイスも同時にいただきました。
「エディタやはいずれ乗り換える(乗り換えざるを得なくなる)可能性が大」なので、
エディタやIDE依存の機能はあまり使わずに、コマンドラインで入力する必要があるもの等は
普通にMacのTerminal等を使っておいた方がこういったケースでも問題が発生しにくい」
「ターミナルはターミナルとして使うのがベター。理由としては
- エディタに依存する設定を毎回行うのもトラブルシューティングにかけるのも手間である
- 何かしらのエラーに遭遇したときに回答できる人が少ない
- 仮に成功してもそれほどのリターンがあるわけではない
vagrantなら、本来は編集したいファイルをマウントするのが一般的なので、その方法が楽かなとも思う」
今回私は有る種意固地になってこの問題の解決に取り組んだ訳ですが、
この問題に費やす時間を学習に費やしていれば進むものは進んでいたわけですからね、、、確かにその通りだと思います。
ただ、一つの問題を深く掘り下げてググって行く、という経験としては、無駄にはならんのではないかと自分では思っています。
差し当たって問題は解決したので、ドットインストールの通常学習に戻りたいと思います。
ご協力頂いた皆様、誠にありがとうございました。