Microbuild low code has been launched “modular mixed development” capability.

On the basis of visual editing applications, users can enjoy a more complete one-stop development experience through code development and application deployment.

The usage scenarios and methods of modular mixed development will be introduced in detail below.

Application scenarios

Application Scenario 1: Multi-team development

When developing a large project, it is often not possible for one main development team to develop it alone, and the collaborative scenario of a large project determines the pattern of multi-team collaborative development. However, when multiple teams cooperate to develop a project, they will encounter various problems. If they are not properly handled, they will cause low development efficiency and delayed progress, which is a major risk point of the project.

Application Scenario 2: Low code development combined with traditional code development

Some of the micro-partner users are not developing from scratch, so they will encounter the problem of migration of the existing applications. Sometimes, due to time constraints, it is difficult to migrate all the content of an application with low coding.

Solution: module mixed development

In view of the above pain points, we can use sub-module mixed development to solve. Tencent Cloud micro build low code on the basis of visual editing applications, provides a way to develop and deploy applications through code. It has the following advantages:

  • An application can be divided into main module and several sub-modules, which are developed by modules.
  • Each module is decoupled and relatively independent;
  • Each module supports two development modes: [low code development] and [upload code package].
  • After the completion of development, by the micro platform to complete the merger package release, the whole process is convenient and easy.

Basic Concepts:

  • Application main module: Each application must have a unique application main module. In contrast to submodules, the master module has an application-level configuration.
  • Application submodules: Each application can have N submodules, and how to split them depends on the configuration of the developer.
  • Low code development pattern: Visual development by microbuilding low code.
  • Upload code package mode: allows users to upload code packages in traditional development mode.

Note: Currently only hybrid development of applets is supported. Experience mixed development

Method of use

The use of modular mixed development needs to first clear the relationship between the master and child, each module low-code mode is considered as a low code editing application, code package is considered as a native applet application.

  • Code package as main module: It is necessary to ensure that the content is a complete small program project code and the project structure meets the requirements of the following system restrictions. Mount the Weda app object in the onLaunch function of app.js (add the code, this.app = wedaApp). Subpackages and other modules can get the Weda app object via const {app} = getApp().
  • Code packages as submodules: Ensure that the contents are independent of the miniprogram application directory, that is, the miniprogramRoot directory. The entire project will be placed in the/Packages /${subapp.name} path, so the parts of the original file references and route jumps that use absolute paths may need to be corrected. The relative path relationships of files within packages will not change. In general, it is required that the final code package be transformed into the code package of the applet subpackage pattern, and that an app.json be added to declare the list of pages in the package. For example, the contents of app.json in sub package sub are:
{
  "pages": [
    "pages/index/index",
    "pages/checkbox/index",
    "pages/switch/index",
    "pages/slider/index"
  ]
}
Copy the code

The resulting full applet app.json will eventually add the configuration:

{
  "subpackages": [
    {
      "root": "packages/sub",
      "pages": [
        "pages/index/index",
        "pages/checkbox/index",
        "pages/switch/index",
        "pages/slider/index"
      ]
    }
  ]
}
Copy the code

Master/sub-module with low-code editing: the system will automatically generate the relevant code, there is no need to care too much about the reference relationship, only the business logic of the application itself, when the current page jumps to the page of the main package, or the page of the sub-package.

Master/submodule interaction

The micro-overlap application state is divided into the global state and the page-level state. The global state is shared by the entire application, and the page-level state is independent for each page. Therefore, when data interaction between master and sub-modules is required, the global state should be used for proxy storage. In low code, it is possible to get/assign global variables on app objects by getting app objects. In code package type modules, it is possible to getApp objects by using const {app} = getApp() to get/assign variables, and use data sources.

${page.id}/index; ${page.id}/index;

/ packages/subapp. Name/pages / {subapp. Name} / pages/subapp name/pages / {page. Id} / index.

You need to specify the template address when handling route redirection.

Note the following restrictions:

  • Each application contains one main module and no more than five sub-modules. When the main sub-module contains at least one low-code edit type module, it can be mixed built on the micro-build platform.
  • When the main module is the type of code package, it is a complete applappling, and the root directory after decompression should contain the project.config.json file, in which the miniprogramRoot directory is declared. Otherwise, it is the root directory by default. The root directory contains app.json, app.js, app. WXSS and other application-level files. Packages, common, APP, Materials, and Lowcode are reserved directories.
  • If the submodule is code package type, it must be an independent small program application directory, namely miniprogramRoot. The decompressed root directory contains application-level files such as app.json, whose contents are merged with the low-code generated main module configuration.
  • Application level low code, variable management, can only be completed in the main application, low code editing class submodule can be viewed in the editor, but cannot be defined declaration and add, delete, change and edit.