Overview & Requirements:
In this tutorial, I will show you how to how to use Cordova to create an Xcode project that will run your game on an iOS device. This tutorail will not teach you how to get your game on the App Store.
You will need a computer running macOS with Xcode 13 installed. You can download Xcode from the Mac App Store.
You will also need an iOS device, as RPG Maker games do not play nicely with the emulator that Xcode uses.
I will be walking you through the steps to get a successful Xcode 13 project setup that you can run your game with. There may be extra steps you need to take if any errors come up. Please feel free to use this thread to ask for help, or shoot me a private message.
It helps to be somewhat comfortable using Terminal, as it is how we will create our Xcode project. But if you just follow these instructions and run these commands in order, you will have a project that opens nicely in Xcode 13.
Notice: Only use Terminal to run these commands, do not use a third-party terminal software (such as iTerm2). I ran into a lot of permission issues when attempting this with iTerm2 so just use the default terminal app.
Step 0 - Download and Install Node.js and Brew Download Node.js - Follow this link to download Node.js from their website. There is no special configuration needed, just keep clicking next. Install Brew - Brew is a package manager for macOS. The link will take you to their website, where you need to run a command in Terminal. Once you have installed Brew, close that Terminal window you opened.
Step 1 - Install Cordova From here on out, when you see a command in code formatting, copy and paste it into the Terminal window and hit Enter/Return.
We first must install Cordova on our machine. Use this command:
Code:
sudo npm install -g cordova
and wait for it to complete.
Step 2 - Setup our Cordova project folder
This tutorial assumes you've already deployed your game to the Output folder, using File -> Deployment in RPG Maker MZ.
First, cd into the Outputs folder:
Code:
cd ~/Documents/Output
Then, we use the following command to create our Cordova project directory. Before we do that we will look at a breakdown of the command:
folder name – This is the name of the folder that will hold your Cordova project. You can name it whatever you like. bundle identifier – this can be set to com.example.example for now, but it will need to be changed
later on if you wish to deploy to the App Store. Use Google for more info on bundle identifiers. app name – this will be the name of your app as it appears on your device.
For example:
Code:
cordova create myfirstapp com.example.myfirstapp MyFirstApp
After we have created our project folder, cd into it:
Code:
cd myfirstapp
Step 3 - Setup our iOS deployment platform
Now that we are in our Cordova app folder, we need to add iOS as one of our deployment platforms. Use this command:
Code:
cordova platform add ios
Once that finishes, we next need to install a few iOS specific plugins and tools to help us build our app. Use the following commands, one by one after each finishes:
Code:
xcode-select -–install
If you get a message that command line tools are already installed, keep going.
Code:
brew install ios-deploy
Once all the commands have been used without errors, keep this Terminal window open, and open a Finder window.
Step 4 - Move our game into our Cordova project
In the new Finder window, navigate to Documents, then Output, then our game's folder. Inside you should see a file named "index.html". If you don't see it, you're in the wrong spot.
Select all the files and folders you see (Command+A) and copy them (Command+C).
Next, navigate out of our game folder and into our Cordova project folder. Inside, there should be a folder named "www". Open that, and delete all the files inside.
Finally, paste the files and folders you copied (Command+V).
Once you've done this, head back to that same Terminal window you kept open.
Step 5 - Build our Cordova project
Now that we have all of our necessary files in place and plugins installed, we can finally build our Cordova project.
Make sure you are still inside the Cordova project folder, but not inside the www folder. If you use the 'ls' command, you should see a file named "config.xml". That will confirm you're in the right spot.
Run this command:
Code:
cordova build ios
And wait for it to finish. If all goes well, you should see a "** BUILD SUCCEEDED **" message.
Now we have a proper Xcode project file that we can open and run on our device! Using Finder, navigate into our Cordova project folder, then into "platforms", then into "ios". Inside, you should see our completed .xcodeproject file!