ユーザ用ツール

サイト用ツール


vscode:debugger

差分

この文書の現在のバージョンと選択したバージョンの差分を表示します。

この比較画面にリンクする

両方とも前のリビジョン 前のリビジョン
vscode:debugger [2019/06/25 17:07]
h-eguchi [4.Steps to using the debugger]
vscode:debugger [2019/06/25 17:08] (現在)
h-eguchi 以前のリビジョンを復元 (2019/05/29 17:56)
ライン 1: ライン 1:
-====== ​How to use debugger in VSCode ​====== +====== ​VScodeでデバッガを使用する方法 ​====== 
-Debugger ​is a tool that supports you to debug a program.\\ +デバッガ(Debugger)とは、プログラムのデバッグを助けてくれるツールです。\\ 
-It allows you to check the status of variables or use what's called stepwise execution to follow the behavior of a program... It allows you to debug much efficiently than using ''​print()'' ​to debug.+変数の状態を確認できたり、ステップ実行という方法でプログラムの動作が追えたり等… ​''​print()'' ​デバックよりもより効率的にデバックが可能です。
  
 ---- ----
  
-===== 1.Configure ​config.json (VirtualCast) =====+===== 1.configの設定 ​(VirtualCast) =====
  
 ==== config.json ==== ==== config.json ====
ライン 25: ライン 25:
 </​file>​ </​file>​
  
-==== Configurations related to debugging ​====+==== デバックに関する記述 ​====
  
 <​code>​ <​code>​
ライン 36: ライン 36:
 </​code>​ </​code>​
  
-To use MoonSharpDebug ​plug-in in VS Code...\\ +VScode の MoonSharpDebug ​のプラグインを使用する場合…\\ 
-You need to write  ​''"​moonsharp_debugger_port":​ 41912'' ​in the debug section of the config.json.\\+configのDebugに関する部分に ​''"​moonsharp_debugger_port":​ 41912'' ​の記述が必要です。\\
  
-===== 2. Adding debugger plug-in on VS Code (VScode) =====+===== 2.VScodeにデバッガのプラグインを追加 ​(VScode) =====
  
-{{:vscode:moonsharpdebug.png?​direct&​400|}}+{{:モデル作成:vci作成:​vci_debugger_1.png?​direct&​400|}}
  
-After launching VS Code, select [Extensions] from the tab on the left, and in the search box type [MoonSharp].\\ +VScodeを起動後、左のタブから拡張機能を選択して[MoonSharp]で検索してください。\\ 
-Click on [MoonSharp Debug] ​from the search result to open the page and click [Install] to install the plug-in.\\+[MoonSharp Debug]のページが新規のタブで開くので、そこからプラグインをインストールします。\\
  
-===== 3. Create ​launch.json ​in the VS Code workspace ​(VS Code) =====+===== 3.VScodeのワークスペースにlaunch.jsonを作成 ​(VScode) =====
  
-To use the VS Code debugger on Virtual Cast...\\ +VScodeのデバッガをVirtualCastで使用する場合…\\ 
-You need to create a folder for [.vscode] ​right under the [EmbeddedScriptWorkspace] folder, then inside the newly created folder, create ​[launch.json]. ([launch.json] ​is the settings file for the debugger)\\+[EmbeddedScriptWorkspace] フォルダの直下に ​[.vscode] ​のフォルダを作成し、その中に ​[launch.json] ​を作成する必要があります。( ​[launch.json] ​debuggerの設定ファイルになります)\\
  
-** 1. Open the [EmbeddedScriptWorkspace] ​folder ​**+** 1. [EmbeddedScriptWorkspace] ​のフォルダを開く ​**
  
   C:/​Users/​__USER_NAME__/​AppData/​LocalLow/​infiniteloop Co,​Ltd/​VirtualCast/​EmbeddedScriptWorkspace   C:/​Users/​__USER_NAME__/​AppData/​LocalLow/​infiniteloop Co,​Ltd/​VirtualCast/​EmbeddedScriptWorkspace
  
-  ​Replace ​__USER_NAME__ ​with your PC's user name.+  __USER_NAME__ ​の箇所は使ってるパソコンのユーザー名になります。
  
-{{:vscode:revealinexplorer.png?​direct&​400|}}+{{:モデル作成:vci作成:​vci_debugger_2.png?​direct&​200|}}
  
-If the [EmbeddedScriptWorkspace] ​folder is already open in VS Code...\\ +既にVScodeで ​[EmbeddedScriptWorkspace] ​フォルダを開いてる場合…\\ 
-On the workspace of VS Code, right-click to open the menu and click on [Reveal in Explorerto open the folder.\\+VScodeのワークスペース上で右クリックからメニューを開いて[エクスプローラーで表示します]を押すと、開くことができます。\\
  
-** 2. Create a folder named [a.vscode] ​in the [EmbeddedScriptWorkspace] ​**+** 2.[EmbeddedScriptWorkspace] に [a.vscode] ​という名前のフォルダを作成する ​**
  
-{{:vscode:createnewfolder.png?​direct&​400|}}+{{:モデル作成:vci作成:​vci_debugger_3.png?​direct&​400|}}
  
-Create a folder named [a.vscode] ​right under the folder [EmbeddedScriptWorkspace].\\ +[EmbeddedScriptWorkspace] フォルダの直下に ​[a.vscode] ​というフォルダを作成してください。\\ 
-Trying to directly create a folder ​[.vscode] ​will cause an error.\\+直接 ​[.vscode] ​というフォルダを作ろうとしても、エラーになります。\\
  
-** 3. Launch Command Prompt ​**+** 3.コマンドプロンプトを立ち上げる ​**
  
-{{:vscode:commandprompt.png?​direct&​400|}}+{{:モデル作成:vci作成:​vci_debugger_4.png?​direct&​200|}}
  
-In the search box at the bottom left corner of the desktop, type "cmd" to find the Command Prompt in the search result.\\ +左下の検索ボックスで [cmd] と入力すると、コマンドプロンプトが検索結果に出てきます。\\ 
-Launch Command Prompt from there.\\+そこからコマンドプロンプトを起動してください。\\
  
-** 4. Edit the folder name from Command Prompt ​**+** 4.コマンドプロンプトでフォルダ名を編集する ​**
  
-{{:vscode:changefoldernamecmd.png?​direct&​800|}}+{{:モデル作成:vci作成:​vci_debugger_5.png?​direct&​400|}}
  
   cd C:​\Users\__USER__\AppData\LocalLow\infiniteloop Co,​Ltd\VirtualCast\EmbeddedScriptWorkspace   cd C:​\Users\__USER__\AppData\LocalLow\infiniteloop Co,​Ltd\VirtualCast\EmbeddedScriptWorkspace
   ​   ​
-In the Command Prompt, enter the command above to open the [EmbeddedScriptWorkspace] ​folder.\\ +コマンドプロンプトで上記のように入力して[EmbeddedScriptWorkspace]フォルダを開きます。\\ 
-It is a good idea to copy the file path from the Explorer with the [EmbeddedScriptWorkspace] ​open.\\ +ファイルのパスは実際に[EmbeddedScriptWorkspace]フォルダを開いた状態で、エクスプローラーからコピーするとよいです。\\ 
-Replace __USER__ with your PC's user name.+USERの箇所は使ってるパソコンのユーザー名になります。\\
  
   rename a.vscode .vscode   rename a.vscode .vscode
  
-Next, use the command "rename" to rename the folder ​[a.vscode] ​to [.vscode].\\ +次に ''​rename''​ という命令を使って[a.vscode]のフォルダを[.vscode]にリネームします。\\ 
-After you have done above, check the folder to see if the name is changed to [.vscode].\\+上記のように入力してフォルダの名前が[.vscode]になっている事を確認してください。\\
  
-** 5.Create ​[lanuch.jsoninside the [.vscodefolder**+** 5.[.vscode]フォルダの中に[launch.json]を新規作成 ​**
  
-In the [.vscode] ​folder, right-click to open the context menu and...\\ +[.vscode]フォルダの中でメニューを開いて…\\ 
-select ​[New] > [Text Documentto create a text file, then rename it to "launch.json".\\ +[新規作成]>[テキストドキュメントを作成し、できたファイルを ''​launch.json''​ にリネームしてください。\\ 
-OR, you can download the [launch.json] ​file from below and save it in the [.vscode] ​folder.\\+※もしくは、下記の[launch.json]ファイルをダウンロードして[.vscode]内に保存してもよいです。\\
  
-** 6. Copy and paste the text below into [launch.json] **+** 6.[launch.json]の中に下記をコピペ ​**
  
 ==== launch.json ==== ==== launch.json ====
ライン 116: ライン 116:
 </​file>​ </​file>​
  
-Open the [launch.json] ​file you just created and copy and paste the text above, then save.\\+先ほど作った[launch.json]ファイルを開いて、上記のテキストをコピペして保存します。\\
 \\ \\
-FYI: The official reference have ''"​debugServer":​ 41912,'' ​written in the wrong place.\\ +※補足ですが…公式のリファレンスは ​''"​debugServer":​ 41912,'' ​の記述箇所が間違ってます。\\ 
-The [launch.json] ​above has it in the right place.\\+上記の[launch.json]は修正した内容になっています。\\
 [[https://​marketplace.visualstudio.com/​items?​itemName=xanathar.moonsharp-debug|MoonSharp Debug]] [[https://​marketplace.visualstudio.com/​items?​itemName=xanathar.moonsharp-debug|MoonSharp Debug]]
  
-===== 4.Steps to using the debugger ​=====+===== 4.デバッガを使用する手順 ​=====
  
-**Import a VCI that includes a script into Virtual Cast**+**VirtualCastにスクリプトを含むVCIを取り込みます**
  
-1. Upload a VCI with VCI script included on THE SEED ONLINE.\\ +1.THE SEED ONLINE ​にVCIスクリプトを含むVCIをアップロードする。\\ 
-2. Launch Virtual Cast and link with THE SEED ONLINE.\\ +2.VirtualCastを立ち上げてSEED連携を行う。\\ 
-[[en:seed:uploadvci|Run in Virtual Cast]]+[[seed:upload:vci|バーチャルキャストで実行]]
  
-** How to use the debugger ​**+** デバッガの使い方 ​**
  
-{{:vscode:startdebugging.png?​direct&​400|}}+{{:モデル作成:vci作成:​vci_debugger_6.png?​direct&​400|}}
  
-First, launch Virtual Cast and enter into a studio, then spawn the VCI to debug.\\ +まず、VirtualCastを立ち上げてスタジオに入り、デバックを行うVCIを取り出します。\\ 
-After that, in VS Code, launch debugger from [Debug] > [Start Debugging].\\+その後、VScodeの[デバッグ]>[デバッグ開始]からデバッガを起動します。\\
  
 {{:​モデル作成:​vci作成:​vci_debugger_7.png?​direct&​400|}} {{:​モデル作成:​vci作成:​vci_debugger_7.png?​direct&​400|}}
  
-You can set breakpoints by clicking on the left of line numbers.\\ +行番号の左をクリックすると、ブレークポイントの設定ができます。\\ 
-A breakpoint is ** a point at which the program will pause when scripts up to the line with the point is ran**.+ブレークポイントとは、**ブレークポイントの行までプログラムが実行された場合一時停止する箇所** です。\\
 \\ \\
-On the example above, breakpoints are set inside the ''​onGrab()'' ​function. Go back into the studio and grab the VCI.\\ +上記の例では ​''​onGrab()'' ​の中にブレークポイントが設定されているので、スタジオに戻りVCIを掴みます。\\ 
-After grabbing the VCI, you normally expect to see three "print()" executed, but they are not.\\ +掴んだ後、本来なら3回の ''​print()''​ が実行されるはずですが、実行されてないと思います。\\ 
-By using stepwise execution from the debugger tool in VS Code, you can execute the program step-by-step.\\ +VScodeのデバッガツールから、ステップ実行させる事でプログラムが処理されます。\\ 
-To end the debug tool, click on the red plug icon on the right.\\+終了させる時は、左の赤いコンセントのアイコンでデバッガの実行を終了します。\\
 \\ \\
-By using the debug console and the left-side bar showing the status of variables, you can track after small details that might be hard to track by just using ''​print().''​+デバッグコンソールや、左のバーを見る事で変数の状態を確認したりできるので ​''​print()'' ​では追いづらい細かい挙動もチェックできます。\\
 \\ \\
vscode/debugger.txt · 最終更新: 2019/06/25 17:08 by h-eguchi

ページ用ツール