Subpackage processing of uniapp compiling WeChat applet

[Subpackage] processing of uniapp compiling WeChat applet

The size of the program code package cannot exceed 16MB, so the applet can be opened in seconds, but with the development of the business, all sub-packages of the whole applet are launched with a size of no more than 16M, and 16M cannot be opened in seconds,
so the sub-package loading is introduced. The package size cannot exceed 2M

//Subpackage usage rules Assume that the applet directory structure is as follows:

├── app.js
├── app.json
├── app.wxss
├── moduleA
│   └── pages
│       ├── rabbit
│       └── squirrel
├── moduleB
│   └── pages
│       ├── pear
│       └── pineapple
├── pages
│   ├── index
│   └── logs
└── utils

The developer declares the corresponding subpackage as an independent subpackage by defining the independent field in the corresponding subpackage configuration item in the subpackages field of app.json.

  "pages": [
  "subpackages": [
      "root": "moduleA",
      "pages": [
    }, {
      "root": "moduleB",
      "pages": [
      "independent": true

1. After declaring subpackages, it will be packaged according to the subpackages configuration path, 2. The subpackages configuration path will be packaged
as a subpackage, and the others will be packaged into the app (main package) 3. The app (main
package) can also have its own pages (ie the outermost pages field)
4. The root directory of the subpackage cannot be a subdirectory in another subpackage 5. The
tabBar page must be in the app (main package)
6. Each subpackage can use its own subpackage resources and refer to the resources in the require app, but there is no communication between subcontracting and subcontracting,
and the content in the pages under the subcontracting and the main package is also incommunicable (this needs to be verified)

The content of the main package and other subpackages cannot be relied on in the subpackage, including js files, templates, wxss, custom components, plug-ins, etc.
The app.wxss in the main package is invalid for independent subcontracting. Avoid using the style in app.wxss in the independent subcontracting page, or if independent subcontracting is not applicable, remove “independent”: true;
App can only be in the main package Definition, App cannot be defined in independent subcontracting, which will cause unpredictable behavior;
plug-ins are temporarily not supported in independent subcontracting

Note: When you find that the style is messed up after subcontracting, pay attention to remove the “independent”: true of independent subcontracting, step on the pit yourself, and share it here for everyone to avoid pitfalls

Leave a Comment

Your email address will not be published. Required fields are marked *