Electron Framework to Convert HTML Games to Windows Desktop Games
In this post, we will see how to convert the HTML5 games into the Windows desktop based games. Here we are going to make use of the electron builder and the electron framework for conversion. So let's dive in.
Why HTML Games?
A lot of editors and the simplicity is why I prefer to build the games into the HTML or web format at first. Basically when we are making games out of the HTML we are making INDEX.html, style.css and package.json file that could be converting your entire project into the windows executable.
Which framework to use? As of now only the electron javascript framework can convert the html based applications into the windows executables. So we may have to make use of that.
What you need?
You need a couple of things to get started. Like you need nodejs, yarn package manager too. So we will set things up.
- html 5 based project be it game or app to convert.
- electron framework
- electron builder package
- Python or Node package for running local server
That's it. Now all we have to do is get into the action.
First Things First
Let's see if we have the nodejs, yarn and python on our system.
Open the Target HTML Project
In my case it is one of the game project which I want to convert from the HTML5 to the Windows desktop executable.
Once you have noticed that you have the HTML5 executable project like the one in image for me. You have to open the powershell or command prompt there.
Next thing you can do is make sure to call for the electron builder package and make use of the yarn for running the build.
As you can see you are adding the electron-builder package to your existing project. And now once it is build through and gives you success of installing the package. Next thing is to build the package so that it can convert the hmlt5 project to the executable.
Your executable in the folder would look something like electron icon. You have to run that in order for it to install on windows. Now if you want to find out similar process for the html5 game conversion in the games like the gdevelop. You may want to find out HTML5 export in GDevelop editor.
I hope you have found some value out of this process. This process works for both games and also the apps. As long as the necessary build files are there you would be able to make the apps and games out of the HTML5 games and apps to the windows, android and iOS export there.