标签：uniapp style 系列 form formPage 之二 selectCity main pages

今天在用真机在小程序上预览的时候。发现无法预览。一直报错超过微信最大2m。总共也才3个页面，怎么就那么大？

经过小程序包分析工具发现。打包以后的vender.js文件达到1.7m，最后发现，在main.js中引入了一些无用的第三方库。包括echarts和uview，node_modules中有两个包：uview-ui和uview，删除以后xbuild运行发行在小程序开发者工具中发现只有738k。

第二是采用分包策略：

第一步：拆分原本在pages文件件中的页面。

第一步：在pages.json新增subPackages选项，如下图所示：

{
	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
		{
			"path": "pages/index/index",
			"style": {
				"navigationBarTitleText": "风格报价计数器"
			}
		}
    ],
	"subPackages":[
		{
			"root":"formPage",
			"pages":[
				{
					"path":"form/form",
					"style" :
					{
					    "navigationBarTitleText": "填写房屋信息",
					    "enablePullDownRefresh": false
					}
				}
			]			
		},
		{
			"root":"selectCityPage",
			"pages":[
				{
					"path":"selectCity/selectCity",
					"style" :
					{
					    "navigationBarTitleText": "选择城市",
					    "enablePullDownRefresh": false
					}
				}					
			]
		}
	],
   "preloadRule": {
		"formPage/form/form": {
			"network": "all",
			"packages": ["formPage"]
		},
		"selectCityPage/selectCity/selectCity": {
			"network": "all",
			"packages": ["selectCityPage"]
		}
	},
}

第三步：在mainfest.json中新增optimization选项，开启分包

//main.fest.json中新增optimization选项

/* 小程序特有相关 */
    "mp-weixin" : {
        "appid" : "wx099e646e68351ca7",
        "setting" : {
            "urlCheck" : false
        },
        "usingComponents" : true,
		"optimization":{
			"subPackages":true
		}
    },

总结：如果真机无法在小程序预览，特别注意main.js中入口引入的库是否过大。

标签：uniapp,style,系列,form,formPage,之二,selectCity,main,pages
来源： https://blog.csdn.net/baidu_41601048/article/details/122337788

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。