10 Steps to Exe for PC or Mac | GB Studio | Page 1

#

Convert GBStudio Web Export to Executable for Windows or Mac in 10 steps.

#

So let me prefix this with - I am not a web dev and the following may be incorrect or not quite accurate.

I'm just sharing this to try help folk who'd like to try this! ... but ....

I've used these steps today to build Windows and Mac versions of Cave Dave.

Here's 10 steps to convert your GBStudio web export into an .exe for Windows or a .app for Mac.

#

Prerequisite:
npm installed. (Web will help here - beyond the scope of this message)

#

Use GBStudio to export your game for web
Copy contents of ‘web’ folder to new <game name> folder
Terminal to <game name> folder (open a terminal inside this folder)
Install Electron in this folder.
For Mac:
sudo npm install --save-dev electron@latest
For Windows:
npm install --save-dev electron@latest
Install Electron Packager in this folder.
For Mac:
sudo npm install --save-dev @electron/packager
For Windows:
npm install --save-dev @electron/packager
Place the two files attached to this message into the folder ('package.json' and 'main.js')
Open your 'index.html' file in an editor

We're making a small change to this file so the audio will work without having to click on the Window.

Right before '</head>' add these lines:

<script type="text/javascript">
          function focusPlayer() {
            setTimeout(focusPlayerNow, 1000);
          }
          function focusPlayerNow() {
            document.getElementById("game").click();
          }
</script>

These are 2 functions we will call when the game loads to simulate a click which enables the sound

Change the '<body>' line to this:

<body onLoad="focusPlayer();">

That's what will trigger our functions in 7 and enable the sound after 1 second.

Back to the Terminal. Time to build the game!
For Mac: (Silicon Mac - I don't have an Intel sorry but it shouldn't be too tricky)
electron-packager . <game name> --platform=darwin --arch=arm64 --asar
For Windows:
npm exec electron-packager . <game name> --asar
All going well you'll have a new folder now. Look inside that and BINGO! There's your .app (Mac) or .exe (Windows)

📎 main.js 📎 package.json

#

Again, I am NOT a web dev, I hack stuff and swear until things work !:)

So if there's something we can change to make this better/easier let everyone know. Web dev seems to have a heck of a lot of 'well actually...' !:) So be nice.

#10 Steps to Exe for PC or Mac