All Products
Search
Document Center

SuperApp:Develop uni-app miniapps

Last Updated:Nov 07, 2024

This topic describes how to develop uni-app miniapps.

Development process

Two roles are involved in the development of a uni-app miniapp: the developer of the native app and the developer of the uni-app miniapp.

  • The developer of the native app integrates the Superapp solution into the native app by integrating the uni-app miniapp container or other Enterprise Mobile Application Studio (EMAS) components.

  • The developer of the uni-app miniapp uses the scaffolding to quickly develop the miniapp.

image

Prerequisites

Step 1: Create an app

In Application Open Platform of EMAS, create an app and obtain the ID of the app. You can specify the ID to configure your uni-app miniapp and integrate your miniapp project into EMAS. Then, you can use EMAS to build, package, and publish the miniapp. For more information, see Create an app.image

Step 2: Install and configure the HBuilderX extension

Install the HBuilderX extension offline. After the extension is installed and configured, the system can publish the uni-app miniapp in HBuilderX while synchronizing the miniapp artifact to Application Open Platform. For more information, see Install and configure the HBuilderX extension.

image..png

Step 3: Debug the uni-app project

After you run the uni-app project, you can click the image icon in the upper-right corner or select Debug to debug the project. For more information, see Debugging.

HBuilder5

Step 4: Build, package, and publish the miniapp

After you debug the uni-app project, you can package the uni-app project into a uni-app miniapp and synchronize the miniapp artifact to Application Open Platform. Alternatively, you can directly synchronize the locally built uni-app miniapp to Application Open Platform, or package the uni-app project into a native app and integrate a miniapp container into the native app. For more information, see Build, package, and publish a miniapp.

image..png

Step 5: Perform a canary release

In Application Open Platform, create a canary release for the approved app. For more information, see Publish a version.image

Step 6: Publish the miniapp

In Application Open Platform, publish the canary release version of the app. For more information, see Publish a version.image

Step 7: Preview the miniapp

After the miniapp is published, a QR code is generated for the miniapp. You can use Superapp to scan the QR code to preview the miniapp.

References

For more information about uni-app, see the uni-app official documentation.