Page import and export

更新时间:
复制 MD 格式

This topic describes how to use the import and export feature in the Mobi Application Development Platform and provides detailed instructions.

Overview

The import and export feature is a core component of the Mobi Application Development Platform. It lets you package, export, and import pages, layout templates, and Widgets. This helps you reuse, migrate, and share code. This feature lets you:

  • Quickly copy and migrate existing pages, layout templates, and Widgets.

  • Reuse developed modules across different projects.

  • Back up important pages and components.

  • Share developed pages and component resources with your team.

  • Improve development efficiency by avoiding repetitive work.

The import and export feature supports pages, layout templates, and Widgets. It also handles their relationships, such as global code and associated layout templates and Widgets. This ensures that all components function correctly after import.

You can use the import and export feature to efficiently share and reuse resources between applications and improve your development speed.

Export feature

The export feature lets you package pages, layout templates, or Widgets from your current application into a .mobienc file. You can then import this file into other applications.

Procedure

1. Access the export page

  • In the upper-right corner of the Page Management panel, click the More icon.

  • Select the Export Page option.

2. Select an export type

In the export type selection dialog box, select the type of resource to export:

  • Page: Export pages from the application.

  • Layout Template: Export layout templates from the application.

  • Widget: Export Widgets from the application.

3. Export the page

Select the pages to export

  • Based on the selected type (Page, Layout Template, or Widget), select one or more resources to export from the list.

  • You can browse and select resources organized by folder.

Associated settings

  • Based on the selected type, you can configure the export options for associated items:

    • Export associated global code: Choose whether to export global code related to the selected resources. This includes variables, actions, and computed properties.

    • Export associated layout templates (Page type only): Choose whether to export the layout templates associated with the page.

    • Export associated Widgets (Page type only): Choose whether to export the Widgets associated with the page.

Application configuration

If the application uses third-party libraries, icon libraries, or preloaded JavaScript (JS), you can choose to export these configurations. You should export them if the exported resources depend on them or if you want to use the same configuration in the target application.

4. Confirm the export information

  • In the final step, the system displays the structure of the exported resources. This includes:

    • Global code, such as global variables, actions, functions, and computed properties.

    • Page / Layout Template / Widget

    • Associated resource items.

  • After you confirm that the information is correct, click OK to complete the export.

5. Export the file

The exported file is downloaded to your computer in .mobienc format.

Import feature

The import feature lets you import .mobienc files into your current application to restore pages, layout templates, or Widgets and their related resources.

Procedure

1. Access the import page

  • In the upper-right corner of the Page Management panel, click the More icon.

  • Select the Import Page option.

2. Upload the import file

  • Click the upload area to select the .mobienc file to import. You can also drag and drop the .mobienc file into the upload area.

  • The uploaded file appears below the upload area. You can delete it and upload a new file if needed.

3. View the import information

  • The system parses the uploaded file and displays the resources it contains.

  • You can preview the resources to be imported, such as pages, layout templates, Widgets, and global code.

  • Confirm that the resources to be imported are correct.

4. Resolve import conflicts

Note

An import conflict occurs when you try to import a .mobienc file, and a resource in the file has the same unique identifier (ID) as an existing resource in the current application.

The following table describes the conflict types and their scopes.

Conflict type

Scope

Name

Page, Layout Template, Widget, Group

Route

Page

ID

Variable, Function, Computed Property, Integrated Operation, Timer, Plugin

ID conflicts can occur in different scenarios. The resolution strategy depends on the scenario.

The following table describes ID conflict scenarios and how to handle them.


Imported global ID

Import Region ID

Host global ID

You can rename the imported global ID. If the types are the same, you can also discard the imported global ID and use the host global ID.

The system automatically renames the local ID.

Host local ID

Renaming a global import


The system automatically resolves all conflicts by assigning unique names, routes, and IDs. You can change them manually as needed.

Diagram of import differences for conflicting global IDs:

image

Conflict example:

4. Import Report

In this step, the system commits a new version, updates the imported content, displays the import details, and provides a validity report for integrated resources. Committing a version before import is a necessary security policy because it ensures that you can safely roll back the application to its pre-import state. The integrated resource validity report checks the resources that the imported pages depend on and lists any that are unavailable. You can use this report to manually add the required integrated resources.