post Image
RPG ツクール MV のゲームをブラウザ上でテストする

追記 (2015-10-25)

通常のゲーム実行でも F8 キーを押せば Developer Tool が開くようでした。よって以下の記事に書かれていることはほぼ不要です…。

tl;dr

RPG ツクール MV のゲームは単なる HTML なので、適当にローカルの HTTP サーバー立ち上げて、ブラウザのツールでデバッグすればよい。

RPG ツクール MV とは

Steam 版 RPG ツクール MV がとうとう発売されました。日本語版はまだです。

今回のツクールはマルチプラットフォーム対応ということで、 Windows や Mac のみならず、 iOS や Android、 ブラウザでゲームを公開できるようになりました。それに伴い、ゲームスクリプト部分が前作 (VX Ace) までは Ruby だったのが今回は JavaScript になっています。またゲーム本体は HTML (index.html) になっています。

RPG ツクール MV にはスクリプトエディタが付属していないようです。よって直接 JavaScript ファイル等を好きなエディタでいじることになります。実際プロジェクトのフォルダを見てみると、 js フォルダに JavaScript ファイルがあるのが見えるはずです。

「デバッグしづらい」問題

JavaScript を編集しても、ツクールのプレイヤーではデバッグ情報が皆無であり、開発が困難であるという問題があります。なにか問題が起きても画面がそのまま停止したりするだけで、何が問題なのか教えてくれません。

ゲームそのものが前述のとおり単なる HTML なので、ブラウザで動かして、ブラウザの Development Tool (コンソールなど) を使えば楽に開発することができます。しかし単純に index.html を file:// な URL で開いたとしても、パスが合いません。

やり方

プロジェクトフォルダをルートとして公開するような HTTP サーバーを作るだけです。自分の場合は Go で以下のようなものをプロジェクトフォルダに入れて起動しました。別に実装はなんでも良いです。

package main

import (
        "fmt"
        "net/http"
)

func main() {
        port := 8787
        fmt.Printf("http://localhost:%d/\n", port)
        err := http.ListenAndServe(fmt.Sprintf(":%d", port), http.FileServer(http.Dir(".")))
        panic(err)
}

あとは http://localhost:8787/ にアクセスするだけ。うまく行けばゲームがブラウザ上で動いているのが見れます。簡単でしょう?

バトルテストをしたい場合

Utils.isOptionValid を利用します。 URL に適当なクエリをつけた場合に、適当な戦闘が発動するようにすればよいです。

mv.png

その他

キャッシュを無効にしておく (Chrome の場合、 Network の Disable cache をチェックする) と、ツクール側でのゲームの変更が即時に反映されるようになるので便利です。


『 Go 』Article List
Category List

Eye Catch Image
Read More

Androidに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

AWSに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Bitcoinに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

CentOSに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

dockerに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

GitHubに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Goに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Javaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

JavaScriptに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Laravelに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Pythonに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Rubyに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Scalaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Swiftに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Unityに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Vue.jsに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Wordpressに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

機械学習に関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。