Subcontracting configuration of uniapp applet subpackages

Official documents

Use scenarios :

uniapp When developing various small programs, the main package is too large , Unable to upload

There is an option in the developer tool for testing , Can increase the subcontracting size

Subcontracting mechanism

When the applet starts , By default, the main package will be downloaded and the page in the main package will be started , When the user enters a page in the subcontract , The corresponding subcontracting will be downloaded automatically , After the download is completed, it will be displayed .

Every applet that uses subcontracting must contain a main package . The so-called main package , That is, the default startup page /TabBar page , And some public resources are required for all subcontracts /JS Script ; Subcontracting is divided according to the configuration of developers .

At present, there are the following restrictions on the size of small package ：

The size of all packets of the whole small program shall not exceed 20M

Single subcontract / The main packet size cannot exceed 2M

Subcontracting the applet , Can optimize the download time of the first start of the applet , And better decouple and collaborate when multiple teams work together .

Independent services are supported under subcontracting file Catalog , Used to subcontract static resources .

This is the normal component directory

1. First , stay uniapp There was already one in the structure pages My bag （ Folder ） 了 , At this time pages Create a new one in the same level subpkg（commission） package And create a new page

2. To configure pages.json（ Native applets need to app.json To configure ）

stay pages.json Create a new array in "subPackages", The array contains two parameters ：1.root： Is the root directory of the sub package ,2.pages： Which pages does the sub package consist of , The parameters are the same as pages;

	"subpackages": [
		{
    
			"root": "commission/",
			"pages": [
				{
    
				    "path" : "pages/index",
				    "style" :                                                                                    
				    {
    
				        "navigationBarTitleText": " My earnings ",
				        "enablePullDownRefresh": false
				    }
				    
				},{
    
				    "path" : "pages/poster/index",
				    "style" :                                                                                    
				    {
    
				        "navigationBarTitleText": " Invite friends ",
				        "enablePullDownRefresh": false
				    }
				    
				},{
    
				    "path" : "pages/down/index",
				    "style" :                                                                                    
				    {
    
				        "navigationBarTitleText": " The friends list ",
				        "enablePullDownRefresh": false
				    }
				    
				},{
    
				    "path" : "pages/count/index",
				    "style" :                                                                                    
				    {
    
				        "navigationBarTitleText": " Data statistics ",
						"navigationStyle": "custom" ,
				        "enablePullDownRefresh": false
				    }
				    
				}
			]
		}
	],

Be careful ： The main package and subcontract cannot be in the same directory , In the build uniapp Project time , Consider the directory structure , For subcontracting later ;

3. Subcontract preload configuration （preloadRule）

Mainly to optimize speed , If you don't want to optimize the speed, you can skip this configuration

To configure preloadRule after , When entering a page of the applet , The framework automatically pre downloads the subcontracts that may be required , Increase the startup speed when entering the subsequent subcontracting page

preloadRule in ,key It's the page path ,value Is the pre download configuration to enter this page , Each configuration has the following items ：