pagetakaBlog

写真、PC、ネット、岡山、旅の話題をお届けします

VSCode:Rubyデバッグできない。環境、構成をつくりなおす、gemのアンインストールなど。

VSCode上のRubyでデバッグできるまでの備忘録。Ruby動いているだけではデバッグできない…。

<RubyのデバッグをVSCodeでやりたいが失敗続き>

Windows10(64)に、VSCode、そして拡張機能としてRuby0.25.3、Japanese Language Pack for Visual Studio Code 1.38.4 をインストールした状態からスタートです。

デバッグできないんですね、この状態では。これでRubyスクリプト作って[f5]キーを押しても、何も始まりませんでした。

gemの何それをインストールするとか、拡張機能がどうとか、全体がつかめてないのに、やってみても失敗続き。そのうち何をインストールし働いているのか、いないのか、わからない状態になりました。できるだけ最初に近い状態に戻ってデバッグできるよう準備したいと思います。

<gemなど削除>

注意:VSCodeでほかの言語、大切な設定している方はご注意くださいね。Rubyだけやりたいんだけど、デバッグできない、という爺みたいな困ったチャン状態を前提にしています。

それで、拡張機能は先頭に挙げたRubyとJapanese Language Pack for Visual Studio Codeを残し削除(uninstall)しました。そのほか、関係しそうなフォルダ、gemなども削除しました。
gemの削除では「gem をクリーンにする。」を参考にさせていただきました。感謝です。

|gem削除後の状態はdefaultのみ残っていた|

VSCodeのターミナルから、”gem uninstall -I -a -x --user-install --force”(「”」は除く)と入力し[Enter]叩くと、削除していってる状態が表示されます…成功だ…と。
そのあと、“gem list”と入力し[Enter]叩くと、以下のように表示されました。

【gem list】
【gem list】
VSCodeにほぼ余分なものが入ってない状態に戻りました(≒爺の妄想か…)。

|それまでに作っていたRubyスクリプトと関連フォルダも削除|

試しに作っていた xxx.rb とでも名前を付けたRubyスクリプトは、フォルダごと削除しました。

<デスクトップに「rFolder」を作る>

デスクトップに「rFolder」を作ります。これは、今後、RubyをVSCodeで作業するとき使うフォルダになります。

なので、Cドライブ直下に別の名前でも構いません。この記事では、デスクトップに「rFolder」があり、それを使うのだということで続けます。新規フォルダ作成は、Windows基本操作の一つということで説明略。

<VSCodeで「rFolder」フォルダを開く>

VSCodeを起動し「rFolder」フォルダを開きます。メニュ→ファイル→フォルダを開く→(前項からここまでに余分な作業をしていなければ「デスクトップ」が表示される)→「rFolder」を選択し右下の「フォルダの選択」クリック→VSCode画面のエクスプローラに「RFOLDER」が表示される。これで、Ruby用のフォルダができ、使えるようになりました。

【エクスプローラに「RFOLDER」が表示】
【エクスプローラに「RFOLDER」が表示】

<試しに、簡単なRubyスクリプトを書いてみる>

下のスクリプトのうち“sleep(1)”は、ポチ待て1秒、というような意味です。ない状態だとタイミングの問題があるみたいで、エラーが出ることが何回かありました。一呼吸置かせるというようなことで書いているものです。エラーが起こらなければ不要です。

a=3
b=7
c= a * b
sleep(1)
puts c

Rubyスクリプトを保存しないまま[f5]叩いたら「環境の選択」が表示されますが、使える「環境」はありません。「構成の追加」をクリックしてもNGみたいです。Rubyスクリプトを「名前を付けて保存」します。拡張子は「rb」を使い、「test1.rb」として保存しました。ファイル属性に従い、ファイル名の左に表示されるアイコンが赤いのに変わりました。RubyスクリプトというのがVSCodeに認識されているということでしょうね…。で、焦って[f5]叩いてみます。

「環境の選択」には「Ruby」が追加で表示されました。しかし、これを選択してもなにもおこらず、デバッグは始まりません…シクシク。

<左側にある虫マーク>

【左側にある虫マーク】
【左側にある虫マーク】
「デバッグ虫マーク」から始まり、手順は下の画像で。デバッグ虫→歯車→環境選択→Ruby まで進行すると、「環境」のいくつかの選択肢が表示されました。

ここで選択したのは「Debug Local File」です。

【Debug Local File】
【Debug Local File】

|Debug Local File を使う設定はどこにある|

操作に手間取ったりすると、ほぼ意味のない「launch.json」が、「rFolder」フォルダ内に自動的に作られた「.vscode」フォルダ内にできてしまいます。VSCode画面の「launch.json」を「ⅹ」で表示を消したのち、windowsの操作として「.vscode」フォルダを削除すると、改めて新しく始めることができます。「.vscode」フォルダ内にそのほかのファイルがあるときはご注意くださいね…。

|launch.jsonが自動的にできた。デバッグの肝かも|

で、改めて「Debug Local File」のところまで進行すると、つぎのような「launch.json」ができました。

{
  // IntelliSense を使用して利用可能な属性を学べます。
  // 既存の属性の説明をホバーして表示します。
  // 詳細情報は次を確認してください: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug Local File",
      "type": "Ruby",
      "request": "launch",
      "program": "${workspaceRoot}/main.rb"
    }
  ]
}
|一か所 launch.json 修正・保存|

「${workspaceRoot}/main.rb」は、Rubyスクリプトの「main.rb」に対して作業しなさい、VSCodeから見てターゲットは「main.rb」にします、ということかと思います。普段だと、今作業してるのがデバッグしたいんだけど、ということかと思いますので、「${file}」に変更しました。結果、該当行は「 "program": "${file}"」となり、「launch.json」を保存します。

これで「Debug Local File」をつかって、現在作業しているRubyスクリプトがデバッグ対象になるかと思います。「launch.json」タブから「test1.rb」タブへ移動(または「launch.json」消す)→[f5]
何も起こらないように…見えてますけど…。

上辺のメニュ→表示→デバッグコンソール と移動してデバッグの状況を見ると“Debugger terminal error: Process failed: spawn rdebug-ide.bat ENOENT”と表示されていました。まだ、デバッグはできない…。

<ターミナル使い gem インストール。「ruby-debug-ide」>

VSCode上辺メニュー→表示→ターミナル(すでに、デバッグコンソール使用などであればその右に「ターミナル」がある)
ターミナル画面のカーソル位置で ”gem install ruby-debug-ide” と入力し、[Enter]叩いたのち、しばらく待ちましたらインストール成功の表示が出ました。

<[f5]叩いたらデバッグし実行結果が出た>

「test1.rb」を選択し、[f5](デバッグ開始)すると、最下行が青からオレンジに変わりそしてふたたび青に。エラーや警告は0であるのがわかりました。「け・結果はどこに…」ということで「問題 出力 デバッグコンソール ターミナル」パネルの「デバッグコンソール」を選択したら「21」と表示がありました。

【デバッグコンソール】
【デバッグコンソール】
上のスクリプト解説するのもアレなんですけど、念のため。

  1. aは3です。
  2. bは7です。
  3. cは、a ×(掛け算) b の答えです。
  4. 一秒待機(消してもエラーが起こらなければ、本来不要な行です)
  5. 画面にcを表示しなさい
  6. (空白行)

<反省文>

VSCodeでPythonのときは割とらくちんでした。それに比べRubyデバッグ環境を作るのって、ものすごく手順がながいです。そもそも、構成するそれぞれがどんな役割なのかもわからない。初心者の爺には、困難なことでありました。おそらく、しばらくしたら苦労を忘れ、同じことができないようになっている地方の痴呆老人です。

ということで、何回か失敗した状態を削除し、改めてRubyのデバッグ環境を作るということにした記録です。「デバッグ」にはそのほかにも必要なことがたくさんあるでしょうが、爺が現在わかることは、以下の通り。

  1. 失敗した環境、作りかけのRubyスクリプトは潔く削除する
  2. gem関係も削除する
  3. VSCodeとRuby、Japanese Language Pack for Visual Studio Code でスタートする
  4. デスクトップに作業フォルダを作り、そのフォルダをVSCodeのファイルメニュー「フォルダを開く」で開く
  5. 簡単なRubyスクリプトを作り保存する
  6. デバッグ環境の構成としてDebug Local fileを使い、一部を修正(「${workspaceRoot}/main.rb」→${file})・保存
  7. VSCodeターミナルから「gem install ruby-debug-ide」

これで、環境構成ができたはず。
デバッグを実行すれば、デバッグコンソールなどに結果が表示される(はず)。

書式、行頭の扱い、コマンドの候補表示、行そろえ、などなど「デバッグ」に求められることはいっぱいあります。この先、データベースとか、Railsのこととか…。それもこれも、最低限の環境を実現できてこそのことかと思います。

だれかを混乱させたということであれば、申し訳ありませぬ。

|おまけ|

VSCodeのターミナルを使い「gem list」表示させたところ、default以外に新たに加わったのは以下の通りでした。

debase (0.2.4.1)
debase-ruby_core_source (0.10.5)
rake (13.0.0)