uniapp分包,以及通过uni-simple-router进行分包

先说一下uniapp的直接分包方式,很简单:

配置分包信息

打开manifest.json源码视图,添加 “optimization”:{“subPackages”:true} 开启分包优化

我们在根目录下创建一个pagesA文件夹,用来放置需要分包的页面

然后配置路由

运行到小程序,然后完事

uni-simple-router分包方式

文档:路由组件 | uni-simple-router

以下摘录官网

import {
  __dynamicImportComponent__
} from '@/uni-simple-router'

const router = createRouter({
  routes:[{
      path:`/`,
      component:__dynamicImportComponent__(`@/pagesA/tabbar/index.vue`,{
        pageType:`top`, 
        package: {  
          type: `child`,  
          name: `pagesA/tabbar` 
        },  
      }),
  },{
    path:`/pagesB`,
    component:__dynamicImportComponent__(`@/pagesB/tabbar/index.vue`,{
      pageType:`top`, 
      package: {  
        type: `child`,  
      },  
    }),
  }]
})

对于一般小程序来说,uni-simple-router所提供的方法最为便捷,若无其他需求,推荐uni-simple-router。

另外说明一下,uniapp用于小程序的分包,主包只用来存放tabbar上的页面以及核心逻辑代码,其余业务代码都放于子包中,微信小程序发布限定2MB,主包不要超过2MB。

相关推荐

  1. uniapp分包

    2024-04-29 05:54:04       54 阅读
  2. uniapp 分包

    2024-04-29 05:54:04       41 阅读
  3. uni-app选择图片进行覆盖然后分享或打印

    2024-04-29 05:54:04       37 阅读
  4. Vue Router源码分析

    2024-04-29 05:54:04       22 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-04-29 05:54:04       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-04-29 05:54:04       100 阅读
  3. 在Django里面运行非项目文件

    2024-04-29 05:54:04       82 阅读
  4. Python语言-面向对象

    2024-04-29 05:54:04       91 阅读

热门阅读

  1. selenium如何开启手机模式

    2024-04-29 05:54:04       31 阅读
  2. gin学习1-7

    2024-04-29 05:54:04       28 阅读
  3. addEventListener()方法中的参数,以及作用

    2024-04-29 05:54:04       33 阅读
  4. Linux基础 -- Linux 中使用 system 函数的返回值转换

    2024-04-29 05:54:04       29 阅读
  5. 系统服务器选型

    2024-04-29 05:54:04       36 阅读