【Godot】GDScriptをVSCodeで編集しよう

■はじめに

Godotには、Godot内で編集できるというGDScriptというプログラミング言語があります。

エンジン内で完結できるというのは、初心者にはありがたいと思いますが、そこそこ慣れているプログラマー達からすると、少しモヤモヤする部分があったりします。

そこで今回は、VSCodeを利用してより効率的にコーディングできるようにしたいと思います

更新

• 2024.04.13：godot-toolsが2.0.0に更新されたので、一部変更

●注意点

当記事の設定を行うと、日本語のコメントが文字化けしてしまいます。
既存のプロジェクトで使用するのは避け、拡張機能の更新がされるまで英語でのコメントをしましょう

godot-toolsがバージョンアップしたので、別のformatterは不要になりました。

• 日本語も対応可能です！

■準備

• Godotバージョン：v3.5.2.stable.mono.official [170ba337a]
  • 更新後：v4.1.1.stable.official [bd6af8e0e]
• VSCodeバージョン：1.82.2 (user setup)

●Godot

まず、Godot側で外部エディタを設定します
今回はVSCodeを利用しますが、お好みのテキストエディタを利用してください。( 詳細 )

1. ツールバーの[Editor]を開く
2. [General]タブ内で[External]と検索して、[TextEditor]項目内の[External]を選択
3. 色々設定する
   • [Use External Editor]をOnにする
   • [Exec Path]を使用するテキストエディタのパスを入力する
   • [Exec Flags]に上記リンク内の[実行フラグ]テーブル内のものを利用する↓

• VSCode: {project} --goto {file}:{line}:{col}

これで、.gdファイルなどをダブルクリックすると、設定したテキストエディタが開くようになります。

●VSCode

次に、VSCodeをインストールしましょう

1. こっからダウンロード、インストール
   https://azure.microsoft.com/ja-jp/products/visual-studio-code

2. 次に、日本語にしましょう

   • 左側のテトリスみたいなアイコンをクリックして、検索欄に[Japanese]と入力
   • Microsoftの地球儀のやつをインストール
     

3. 設定画面を開いて、[format]と検索して、[Format On Save]を有効にすると楽です。
   

4. 次に、Godotの拡張機能を追加します。先ほどと同様に、検索欄に下記の名前を入力して追加します。

   • Godot-Tools

5. さらに、Godot-Toolsを利用するために、Editorを登録します

   1. Godot-Toolsを選択して、歯車をクリックして、[拡張機能の設定]を選択
      

   2. 一番上の項目の[Editor_Path]ってとこに、Godotのexeファイルのパスをコピペ
      

      • エディタの.exeファイルを右クリックして、[パスのコピー]でパス取得できます
        

これで下準備は完了です。

■使い方

次に、プロジェクトのフォルダを開きましょう

1. ツールバーの[ファイル]の[フォルダーを開く]を選択

2. 目的のプロジェクトのフォルダを選択
   

3. 追加できたら、.gdファイルを選択して開いてみましょう

   • 画面左側のファイルアイコンから、エクスプローラーを開けます。
   • そこにある.gdファイルをクリックして開いてみましょう(無ければGodot側で作成してください)
     

こんな感じに色がついてたらOKです。

整形

Shit + Alt + F で整形できます

こんな感じで使用できます！

変更ダイアログの無効化

また、外部のテキストエディタで保存したら、Godot内でこのようにダイアログが表示されますが、中央のReloadをクリックすればOKです

また、これは鬱陶しいので、設定で無効化できます。

1. ツールバーの[Editor]を選択[Editor Settings]から、検索ボックスに[Auto Reload]と入力
2. [Auto Reload Scripts On External Change]をOnにする
   

■デバッガーを使う

●Godot

1. ツールバーの[Debug]を選択して、[Deploy with Remote Debug]を有効化
   

こんだけです。

●VSCode

・Godot4の場合の設定

こちらにやり方書いてます

1. gdscript_lsp_server_port ってのを6005に変更する
2. 一番上の検索ボックス(コマンドパレット)に>View: Show Run and Debugと入力
3. 「launch.jsonを作成」をクリック
   
4. クリックしたら出てくる、「GDScript Godot Debug」を選択
   
5. launch.jsonの内容を変更
   launch.json

       "configurations": [
           {
               "name": "GDScript Godot",
               "type": "godot",
               "request": "launch",
               "project": "${workspaceFolder}",
               "port": 6007,
               "debugServer": 6006,
               "address": "127.0.0.1",
               "launch_game_instance": true,
               "launch_scene": false
           }
   

6. エクスプローラー内にあるsettings.jsonの内容を変更
   

setings.json

{
    "godot_tools.editor_path": "C:\\godot\\Godot_v4.1.1-stable_win64.exe",
    "godot_tools.gdscript_lsp_server_port": 6005
}

これでOK

・実行

F5を押してデバッグ開始します。

こんな感じの画面になります。

値を確認したい変数上で右クリックして、[ウォッチに追加]を選択して、確認できます

また、VSCode上でブレークポイントのところで停止しない場合、Script Dock上の[Debug]の[Debug with External Editor]をOnにすればいけると思います。
(僕の場合、これがオンになっててもVSCodeで行われなかったですが、一度オフにして再度オンにすればなおりました)

■トラブルシューティング

●GDToolkit(GD Formater)をインストールしようとすると、ValueError: Unknown options: dict_keys(['cache', 'regex'])ってのが出てくる

ようわからん。

公用PCでPythonの拡張機能入れたらこれが出てきた。

このサイトのように設定したら一瞬直ったけど、またエラー出たのでPythonの拡張機能無効化したら直った

■さいごに

これで、Godot内で作業するよりも楽に作業できます！(正直クッソめんどくさいですけど)

●参考サイト