mieki256's diary

公式サイトから npm のインストーラを入手。

_ダウンロード | Node.js

今回は、LTS版 14.15.4 (同梱 npm 6.14.10)、node-v14.15.4-x64.msi をDL。実行するとインストールできる。

デフォルトでは C:\Program Files\nodejs\ にインストールされるが、自分の環境では、D:\Dev\nodejs\ 以下にインストールしてみた。

環境変数 PATH に、フォルダの場所が追加された。

• システム環境変数 PATH に D:\Dev\nodejs\ が追加された。
• ユーザ側環境変数 PATH に C:\Users\(アカウント名)\AppData\Roaming\npm が追加された。

DOS窓を開いて、npm がインストールされたか確認。

> npm --version
6.14.10

npm で love.js をインストールする。

npm install -g love.js

以下の場所にインストールされたっぽい。

> where love.js
C:\Users\(アカウント名)\AppData\Roaming\npm\love.js
C:\Users\(アカウント名)\AppData\Roaming\npm\love.js.cmd

.love ファイルを変換してみる。

利用時のオプション指定は以下。

# Windows
love.js.cmd <.loveファイル名> <出力ディレクトリ> --title <タイトル文字列> --memory <最大メモリサイズ>

# Linux, Mac
love.js <.loveファイル名> <出力ディレクトリ> --title <タイトル文字列> --memory <最大メモリサイズ>

今回は、以下のような指定で変換してみた。

love.js.cmd snake.love ./dist --title "snake" --memory 67108864

Windowsの場合の注意点。love.js と打ってしまうと、拡張子が .js なのでWSH (JScript) が使われてしまってエラーが出てしまう。love.js.cmd を呼び出せば正常に動作する。おそらく、Linux や Mac なら、love.js と打っても問題無いのではないか、と…。

• メモリサイズは標準で 16MB (16777216 byte) が確保されるらしい。
• 32MB にしたいなら 33554432 byte を指定。
• 64MB なら、67108864 byte を指定。

変換後のファイル構成は以下。

.
|-- game.data
|-- game.js
|-- index.html
|-- love.js
|-- love.js.mem
|-- pthread-main.js
`-- theme
    |-- bg.png
    `-- love.css

.data や .mem というファイルが存在するあたりが気になる…。Webサーバ側で設定をしておく必要があったりしないか…？ もしかすると Apache なら .htaccess に以下を書いておいて「この拡張子のファイルはバイナリデータだよ」と設定しておいたほうがいいのだろうか。

AddType application/octet-stream data
AddType application/octet-stream mem

とりあえず、変換結果は以下。

_snake demo

しかし、Firefox なら動いたけれど、Google Chrome、Vivaldi、Microsoft Edge では動かなかった。うーん。

どうやら、LOVE Web Builder を利用して変換したほうがヨサゲだなと。以下は LOVE Web Builder で出力したページだけど、どのブラウザでも動いてくれた。

_snake_lovewebbuilder.html

githubで公開されてる love.js と、npmでインストールされた love.js を比較してみたけれど、ファイル構成からして違うというか…。github版は .wasm があったりするなあ…。

_Davidobot/love.js: LOVE ported to the web using Emscripten, updated to the latest Emscripten and LOVE (v11.3)

github版をインストールして使うにはどうしたらいいのん？ npm ってよく知らないから何が何だか。

とりあえず、VMware Player + Ubuntu Linux 20.04 LTS 上で実験してみる。

Node.js と npm をインストール。

sudo apt install nodejs npm

$ npm --version
6.14.4

$ node --version
v10.19.0

$ nodejs --version
v10.19.0

github から love.js を git で clone して、npm でインストール。

git clone https://github.com/Davidobot/love.js.git
cd love.js
sudo npm install
sudo npm link

ググったところ、package.json というファイルがあるフォルダで npm install をすればローカルに置いてあるパッケージをインストールできるらしい。github から clone した love.js にも package.json が入っているので、これだけでインストールできるのだろう。たぶん。よく分かってないけど。

ちなみに、sudo をつけないで npm link と打ったらエラーが出てしまったので、一応 sudo をつけて作業してみたけど、これで問題無いのかどうかはよく分からない。

どこにインストールされたか調べてみる。

$ which love-js
/usr/local/bin/love-js

/usr/local/bin/ 以下に、love-js というコマンド(?)としてインストールされたらしい。

love.js じゃなくて love-js になってることに注意、だろうか。

.love ファイルを変換してみる。

love-js -c -t "Snake" snake.love ./dist/snake

• snake.love というファイルを変換して、./dist/snake/ ディレクトリに出力した。
• -c をつけると、どのWebブラウザでも動作する版が作れるらしい。その代わり、サウンドの再生が怪しくなるのだとか。
• -t "タイトル文字列" でタイトルを指定できる。

./dist/snake/ に移動して、Python 3.x で簡易Webサーバを立てる。

cd dist/snake
python3 -m http.server 8000

Ubuntu 20.04 LTS 上の Firefox や Chromium で、http://localhost:8000/ にアクセス。…どちらでも動いてくれた。

試しに置いてみる。動くだろうか。

_Snake (github版 love.js で生成)

一応、Windows10 x64 20H2 + 各ブラウザ上で動いているように見える。

ということは、github版の love.js のほうが色々新しくなっていて、Chromium系でも動くファイル群を生成してくれるようだなと…。

Windows10 x64 20H2上でも、github版 love.js のインストールを試してみた。

git clone https://github.com/Davidobot/love.js.git
cd love.js
npm install
npm link

インストール場所を確認。

> where love-js
C:\Users\(アカウント名)\AppData\Roaming\npm\love-js
C:\Users\(アカウント名)\AppData\Roaming\npm\love-js.cmd

変換してみる。

love-js -c -t "Snake" snake.love ./dist/snake_new2

変換もできたし、生成されたファイル群は各ブラウザ上で動いてくれた。