uniapp、小程序分包

uniapp:

安装git

需要仓库git地址链接后加入仓库,然后复制链接地址

新建文件夹,在文件夹里面--git clone 地址

把这个文件夹拉入uniapp后直接运行

 常用配置:

1.工具-设置-常用配置-失去焦点自动保存

2.工具-主题-切换颜色

小程序:

uniapp组件使用:

有时候会遇到明明没有在页面引入组件但是却使用了自定义组件的情况,那是因为easycom规范,在项目根目录下的components目录下注册的组件(name属性必写为组件名)可以不引入直接在其他页面使用,参见:

pages.json 页面路由 | uni-app官网 (dcloud.net.cn)icon-default.png?t=N7T8https://uniapp.dcloud.net.cn/collocation/pages.html#easycomuniapp使用uni扩展组件:

1.可以创建项目是选用带有uni扩展组件的模板,这样无需自己安装

2.单独引入,参见:

uni-app官网 (dcloud.net.cn)icon-default.png?t=N7T8https://uniapp.dcloud.net.cn/component/uniui/quickstart.html有些组件上面那条链接里没有,先去uni插件库搜索再安装(DCloud 插件市场),安装的目录如:

uniapp插件依赖存放:

vue项目存放在node_models中

npm安装包时--save-dev、--dev、-S、-D的区别

  • --save-dev:安装的包出现在package.json文件dependencies对象中
  • -S:安装的包出现在package.json文件dependencies对象中
  • -D:安装的包出现在package.json文件devDependencies对象中
  • --dev:安装的包出现在package.json文件devDependencies对象中

总结:

  • --save-dev-S都有字母s,可理解为save,即为生产依赖dependencies
  • --dev-D都有字母d,可理解为*develop*,即为开发依赖devDependencies
  • webpack不会打包开发依赖
  • 安装依赖后面不加时,默认为安装生产依赖

git修改用户

情景:网页上登录git,账号显示是自己的,提交信息显示的是别人的推送,那是因为这台电脑的原用户还没有修改

先备份项目,然后删掉项目,然后执行如下代码:


git config --global user.name 你的新用户名
git config --global user.email 你的新邮件地址

uniapp配置分包

一、manifest.json文件 ——试图源码

官方文档:manifest.json 应用配置 | uni-app官网 (dcloud.net.cn)

配置optimization的subPackages属性,是否开启分包优化

"mp-weixin": {"optimization":{"subPackages":true}}

二、page.json文件

官方文档:pages.json 页面路由 | uni-app官网 (dcloud.net.cn)

1.配置subPackages数组(只为小程序分包配置):root:为子包的根目录;pages:子包由哪些页面组成,参数同pages;

2. 配置preloadRule(分包预载)

主要目的为速度优化,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度

分包原则:

  1. 主包可以引用分包内文件,分包仅可引用自身目录内的文件,分包与分包间文件无法互相引用,
  2. 要清楚的是分包是一种不得已而为之的手段,确保在分包前项目中静态资源已优化完毕,且没有大量注释或无用代码也是一种手段

所谓的主包,即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本;而分包则是根据pages.json的配置进行划分。

在小程序启动时,默认会下载主包并启动主包内页面,当用户进入分包内某个页面时,会把对应分包自动下载下来,下载完成后再进行展示。此时终端界面会有等待提示。

App默认为整包。从uni-app 2.7.12+ 开始,也兼容了小程序的分包配置。其目的不用于下载提速,而用于首页是vue时的启动提速。App下开启分包,除在pages.json中配置分包规则外,还需要在manifest中设置在app端开启分包设置,详见:manifest.json 应用配置 | uni-app官网

  • 静态文件:分包下支持 static 等静态资源拷贝,即分包目录内放置的静态资源不会被打包到主包中,也不可在主包中使用
  • js文件:当某个 js 仅被一个分包引用时,该 js 会被打包到该分包内,否则仍打到主包(即被主包引用,或被超过 1 个分包引用)
  • 自定义组件:若某个自定义组件仅被一个分包引用时,且未放入到分包内,编译时会输出提示信息

打包原则

声明 subpackages 后,将按 subpackages 配置路径进行打包,subpackages 配置路径外的目录将被打包到主包中

主包也可以有自己的 pages,即最外层的 pages 字段。

subpackage 的根目录不能是另外一个 subpackage 内的子目录

tabBar 页面必须在主包内

引用原则

packageA 无法 require packageB JS 文件,但可以 require 主包、packageA 内的 JS 文件;使用 分包异步化 时不受此条限制

packageA 无法 import packageB 的 template,但可以 require 主包、packageA 内的 template

packageA 无法使用 packageB 的资源,但可以使用主包、packageA 内的资源

主包里的资源(js, template, wxss, components, 图片)都是全局的,可以被公用;而每个分包相当于有自己的“作用域”,自己的资源,只能用自己的或者使用主包的,但不能使用其他子包的资源

① 主包无法引用分包内的私有资源

② 分包之间不能相互引用私有资源

③ 分包可以引用主包内的公共资源

主包范围:

独立分包:

开发者可以按需,将某些具有一定功能独立性的页面配置到独立分包中。原因如下:
当小程序从普通的分包页面启动时,需要首先下载主包
而独立分包不依赖主包即可运行,可以很大程度上提升分包页面的启动速度

参考:微信小程序分包和主包 (yii666.com)

分包后如何判断是否分包成功:

参考:uniapp和小程序如何分包,详细步骤手把手(图解)_uni分包-CSDN博客

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值