微信小程序开发分包的配置

微信小程序分包的配置

在开发微信小程序的时候，微信小程序的包容量为2M一般是够用的，如果开发大一点的项目的话分包的配置是分不开的分包分为独立分包和普通分包；一般包容量够的情况下不进行配置分包这个是最常见的开发方式但是有一种情况可能需要开发者注意一下的哦

// 常见的

├── assets
│   ├── imgs                    // 存放大图，GIF
│   ├── audios                  // 存放静态MP3，非常小的，否则应该放再云
├── config                      // 配置文件
│   ├── config.js
├── http                        // 所有与请求相关的部分
│   ├── libs                    // 与请求相关的libs
│   │   ├── tdweapp.js          // 与talkingdata
│   │   ├── tdweapp-conf.js     // 与请求相关的libs
│   ├── ajax.js                 // 结合业务需要，对wx.request的封装
│   ├── analysisService.js      // 依赖ajax.js，对事件统计系统的接口封装
│   ├── api.js                  // 结合config.js，对所有接口API地址，与开发环境配合，封装的接口地址
│   ├── businessService.js      // 依赖ajax.js，对业务接口封装
│   ├── config.js               // 接口请求相关参数，与服务端系统配套，同时还有开发环境切换
│   ├── eventReporter.js        // 依赖analysisService.js，封装所有事件上报接口，统一管理
│   ├── md5.min.js
├── pages                       // 小程序页面
├── utils                       // 工具库
│   ├── utils.js
├── app.js
├── app.json
├── app.wxss
├── project.config.json

但是在微信小程序的优化方式中有一种方式是分包加载，用户在第一次加载小程序的时候如果包文件过大的话部分手机可能出现加载过慢的情况这是就需要用到小程序的分包加载了

但是根据微信小程序开发文档上进行配置发现报错了，it界中的大牛是存在的最后找到了引路的明灯
方法如下：

1. 首先在app.json中的用一般添加普通文件的方式添加

// app.json
{
"pages": [
    "pages":"index/index"   //正常添加的时候
    "pages/start/start",   //正常添加的时候 
    "/pagesA/one/onde",   //配置分包时候 
    "/pagesB/one/onde"    //配置分包时候
 

2. 一般在app.json中这样配置过后项目的中就会生成对应的文件

3. 生文件的后就可以将app.json中的多余文件删除了

// app.json
{
"pages": [
   "pages":"index/index"   //正常添加的时候
   "pages/start/start",   //正常添加的时候 

4. 再添加分包配置

// app.json
{
"pages": [
  "pages":"index/index"   //正常添加的时候
  "pages/start/start",   //正常添加的时候 
],
"subpackages": [
  {
    "root": "pagesA/",
    "independent": "true",    //是否为独立分包
    "pages": [
      "one/oner"
    ]
  },
  {
    "root": "pagesB/",
    "independent": "true",
    "pages": [
      "one/one"
    ]
  }
],

5. 大功告成

微信小程序中的部分坑

开发的时候用web开发者工具会发现很多的坑比如说时间一长的时候系统的ctrl+c（复制）没有用了
现在官方给出的结果就是将web开发者工具全部关闭了再打开
一般开发微信小程序可以web开发者工具我们是离不开的我们可以使用自己常用的开发工具进行开发小程序的只不过调试和增加页面的时候需要在web开发者工具中进行
vscode这个开发工具相信很多开发者都在使用
webstrom强大的开发工具但是是收费的刚开始还是小白的时候用的破解版的现在购买正版的使用了（如果您是用webstrom开发的不建议安装插件进行小程序的开发会导致webstrom崩溃的）
vscode开发小程序安装插件的方法：

在vscode的商城中有可以下载的很多插件可以搜索wxml进行安装开发
在这里顺便说一下vscode是用前端开发界面的方式写的开发者软件的哦