Teach you how to pack H5 games into fast games

H5 games can be quickly packaged into fast games through the web components of the fast app. After the fast games are packaged and put on the shelves, as long as the url of the original H5 game does not change, the fast games do not need to be updated and the maintenance workload is small.

Using the fast application IDE, the operation of packaging fast games is very simple.

Visit the official website to install development tools and install the Kuaiapp IDE on the PC.
Single select "File> New Project> New Quick Application Project" to create the project, and select "HTML5 Game Template" as the template.

Application name: The name of the application, corresponding to the name field in the manifest.json file.
rpk package name: the package name of the application, corresponding to the package field in the manifest.json file.

Click "OK" to create a quick game project.
Configure the manifest.json file.

package: The package name of the game. Once on the shelves, the package name cannot be modified, otherwise the version cannot be upgraded.
name: The name of the fast game.
versionName: The name of the fast game version, which requires +1 when upgrading, such as 2.0.0.
versionCode: The version number of the fast game, which requires +1 when upgrading, such as 2.
icon: The logo icon of Kuai game, used when creating desktop icon, logo.png needs to be replaced with H5 game icon.
minPlatformVersion: The minimum supported platform version number. The principle is the same as Android API Level. In order to avoid incompatibility caused by the low version after going online, it is recommended to set the highest version, such as 1070.

{
    "package": "com.huawei.quickgamedemo",
    "name": "QuickGameDemo",
    "versionName": "1.0.0",
    "versionCode": 1,
    "icon": "/Common/logo.png",
    "minPlatformVersion": 1070,
    "features": [
        {
            "name": "system.prompt"
        },
        {
            "name": "service.pay"
        },
        {
            "name": "service.account"
        }
    ],
    "permissions": [
        {
            "origin": "*"
        }
    ],
    "config": {},
    "router": {
        "entry": "Hello",
        "pages": {
            "Hello": {
                "component": "hello"
            }
        }
    },
    "display": {
        "titleBar": false,
        "fullScreen": true
    }
}

Edit the .ux file that loads the H5 game. The project project uses the hello.ux file as an example.

src: Configure the url of the H5 game.
fullscreendirection: Set the direction of the game. landscape: horizontal screen, portrait: vertical screen.
jumppolicy: The strategy of link jump in the game. If there are advertisements in the game, it is recommended to set it to browser and set multiwindow to true.
allowthirdpartycookies: Identifies whether to support the delivery of cross-domain cookies, the default is false. If the web page needs to access cookies across domains, such as logging in with a third-party account, you must set this field to true.
trustedurl: If the game login successfully loaded page and the game open page is different, please set it.

Insert picture description here

Select "Tools> Generate Certificate" from the menu to check whether an official certificate has been generated. If it has not been generated, click "Create" to generate the certificate, which is saved in the sign> release directory. Be sure to keep the certificate, once it is lost, it cannot be retrieved.

Insert picture description here

Select "Build> Package Official Version" from the menu to package the official fast game rpk package. The generated rpk package is stored in the dist directory of the project project.

Note: The fast game submitted to the app market must be an official package packaged in this way.

Finally, the directory structure of the entire fast game project is as follows:

Insert picture description here

At this point, you have successfully packaged the H5 game into a fast game. If you want to integrate more functions in the fast game and test and run your fast game, please refer to the official documentation of developing a fast game (H5 version).

Original link:
https://developer.huawei.com/consumer/cn/forum/topic/0204394501350300016?fid=18
Author: Drum Chao

Teach you how to pack H5 games into fast games

Guess you like