uniapp打包成小程序,用uniapp开发小程序的步骤

　　本文为大家带来了关于uniapp的跨领域知识，包括uniapp和小程序分包的相关问题。每个使用分包的小程序必须包含一个主包。所谓主包，即放置默认的启动页面/TabBar页面，所有分包都需要一些常用的资源/JS脚本；分包是根据开发商的配置来划分的。希望对大家有帮助。

　　UNI-APP开发(仿饿)开发课程：进入学习

　　推荐：《uniapp教程》

一、小程序分包

　　每个子包必须包含一个主包。所谓主包，即放置默认的启动页面/TabBar页面，所有分包都需要一些常用的资源/JS脚本；分包根据开发者的配置划分。

　　小程序启动时，会下载主包，默认情况下会启动主包中的页面。当用户进入分包合同中的页面时，客户端会下载相应的分包合同，并在下载完成后显示。

　　目前小程序的分包规模有以下限制：

　　小程序整体包装尺寸不得超过20M，单个包装/主包装尺寸不得超过2M。分包小程序可以优化小程序首次启动的下载时间，在多个团队联合开发时可以更好的解耦合作。

　　直接点这里看官方分包教程，简单易懂。

二、uniapp分包小程序

　　 App默认为整包。兼容小程序的分包配置。它的目的不是为了加快下载，而是为了在首页是vue的情况下加快启动。

　　这是我分包小程序后的目录结构。

　　组件：公共组件(主包参考用)page_后面跟着拼音的都是分包组件。分包vue页面中的组件只能在自己的page_zhaoshang分包目录中引用。Pages为主包，还有所有的启动页面/TabBar页面。公共静态资源放在静态中。图片类

分包步骤：

　　:

1.配置manifest.json

　　。

　　优化:{ 子包:true}

　　}

　　优化分包：

　　在相应平台(manifest.json)的配置下添加 optimization :{ sub packages :true }打开分包优化。

　　目前只支持MP-微信、mp-qq、MP-百度的分包优化。

　　静态文件：委外下可以复制静态和其他静态资源，即放在委外目录下的静态资源不会打包到主包中，js文件也不能在主包中使用：当一个js只被一个委外引用时，会打包到委外包中， 否则仍会命中主包(即被主包或多个分包引用)自定义组件：如果自定义组件只被一个分包引用，如果没有放入分包，编译时会输出提示信息

2.配置pages.json

　　。 在pages.json中新建一个数组‘subPackages’，数组包含两个参数：1.root:子包的根目录，2.pages:一个子包由哪些页面组成，参数与pages相同；

　　注意：主包和分包是不能再同一目录下，在构建uniapp项目时，可以考虑一下目录结构，以便后期进行分包；

3.分包预载配置（preloadRule）

　　这一步主要是优化速度。不想优化速度的可以跳过这个配置。

　　配置preloadRule后，当你进入applet的一个页面时，框架会自动预下载可能的分包，以提高你进入后续分包页面时的启动速度。

　　在preloadRule中，key是页面路径，value是进入此页面的预下载配置。每个配置都有以下项目：

　　Type必需默认值表示packagesStringArray是进入页面后无预下载包的根或名称。__APP__表示主包。网络字符串没有在指定的网络下预下载wifi。可选值为：all(无限网络)和wifi(仅在wifi下预下载)。也支持preloadRule，但网络规则无效。

　　示例：

　　最后点击进入uniapp官方文档查看配置项。

　　推荐：《uniapp教程》以上是手把手教你uniapp和小程序分包(图文)的细节。更多请关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。