VSCode で HSP3 の開発環境を作る [2019年末]

HSP3 の開発ツールをいくつか作ってみたので、その紹介をかねて、Visual Studio Code (VSCode) による開発環境の手順を書きます。

想定読者

本稿は HSP3 に十分に慣れているユーザーのみ想定しています。ターミナルでの操作も必要になります。現時点では基本的に、 スクリプトエディタなど標準のものを使うほうがおすすめ です。

また、詳細は後述しますがスクリプトを UTF-8 で保存し、UTF-8 ランタイム上で実行するというかなり普通でない前提の下で環境を構築します。

標準のスクリプトエディタはまだ UTF-8 に対応していないため、標準のスクリプトエディタでは開けなくなります 。(正確には開くと文字化けする。)

というわけで、いるかどうか分からない読者を想定しつつ、とりあえず書いていきます。

GINGER プロジェクト

本稿で紹介するツールのソースコードは以下のリポジトリにあります。

• vain0x/hsp3-ginger: HSP3 開発ツールを作るプロジェクト
• vain0x/knowbug: HSP3 拡張版デバッグウィンドウ

UTF-8 を使いたい

HSP 3.5 から UTF-8 版ランタイム hsp3utf が追加され、スクリプトを UTF-8 エンコードで保存しても問題なく動作するようになりました。

参考: HSP3UTFとは

また、HSP 3.6β1 から64ビット版のランタイムも UTF-8 で動作するようになったようです。

参考: HSP3.6β1を公開しました - おにたま(オニオンソフト)のおぼえがき

世界的にエンコーディングは UTF-8 に一本化されつつあるので、積極的に利用していきたいですね。

繰り返しになりますが、本稿ではスクリプトは UTF-8 で保存し、UTF-8 ランタイム上で実行することを前提としています。というか、私が作成したツールの多くがまだ shift_jis に対応できていません。

Visual Studio Code (VSCode) とは

Visual Studio Code はオープンソースで開発されている 最高に便利なテキストエディタ です。

構文定義

VSCode は既定では HSP 言語の認識やスクリプトの構文強調 (色分け) に対応していないので、そのための拡張機能をインストールする必要があります。

そのような拡張機能は私の知る限りでは2つあって、どちらを選んでも問題ありません。

• honobonosun.language-hsp3 (GitHub)
  • 構文定義に加えてアウトライン表示などの機能があります。
  • インストール手順などはリンク先を参照。
• vain0x.hsp3-vscode-syntax (GitHub)
  • こちらは構文定義だけです。しかも構文定義は @honobonosun 氏が作成したものを流用しているので、前者とだいたい同じです。

ここでは後者を使っていきます。(コメントが // スタイルなため。)

デバッグ実行

拡張機能 vain0x.hsp3-debug-window-adapter をインストールすると HSP のスクリプトを F5 で実行できるようになります。

概要に書いてある通り、HSP のインストールディレクトリを設定に追加する必要があります。(Ctrl+, で設定を開いて hsp3-root で設定項目を検索して、入力欄にインストールディレクトリのパスを書く。)

VSCode のデバッグ用のボタン類は機能しませんが、普通にデバッグウィンドウが開くので、それでデバッグできます。

なおデバッグウィンドウも作っているので、よかったら試してみてください。

knowbug

インテリセンス

スクリプトエディタのよいところに F1 キーを押すだけでヘルプが見れるというのがあります。

拡張機能 vain0x.hsp3-analyzer-mini をインストールすると、命令などにマウスポインタをあてると説明が見れるようになります。

こちらも HSP のインストールディレクトリの設定が必要です。

標準の命令だけでなく、#deffunc などで定義した命令の上部にあるコメントも見れます。入力補完や、「定義に移動する」「すべての参照を検索する」にも対応しています。

実行ファイル作成

UTF-8 で保存されたスクリプトを標準のスクリプトエディタで開くと、文字コードの問題でコンパイルが通らないことがあるので、ビルドツールを使う必要があります。

ただし、標準のビルドツールである hspcmp.exe は実行ファイルの作成に対応していません。

そういうわけで、ビルドツール ginger を作ったのでご利用ください。以下のリンクからダウンロードできます。

< ginger.exe のダウンロード >

ginger.exe を HSP のインストールディレクトリに配置してパスを通すと ginger コマンドが使えるようになります。

ginger build コマンドにより UTF-8 エンコーディングで保存されたスクリプトの実行ファイルを作成できます。

ginger build --release app.hsp