微信小程序从零到一：原生开发者工具开发【2】

2023-09-24 11:27:18

一、前言

微信小程序是一种非常流行的开发框架，它可以帮助我们快速开发出具有原生 App 体验的小程序。原生开发者工具是微信官方提供的开发工具，它可以帮助我们快速构建微信小程序。

在本文中，我们将从零开始学习如何使用原生开发者工具开发微信小程序。我们将学习如何配置 tabBar、如何理解分包以及如何开发小程序。

二、tabBar 的配置

tabBar 是小程序底部的一排导航栏，它可以帮助用户在小程序中快速切换页面。tabBar 的配置非常简单，只需要在 app.json 文件中添加如下代码即可：

{
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath": "images/tabbar/home.png",
        "selectedIconPath": "images/tabbar/home_active.png"
      },
      {
        "pagePath": "pages/category/category",
        "text": "分类",
        "iconPath": "images/tabbar/category.png",
        "selectedIconPath": "images/tabbar/category_active.png"
      },
      {
        "pagePath": "pages/cart/cart",
        "text": "购物车",
        "iconPath": "images/tabbar/cart.png",
        "selectedIconPath": "images/tabbar/cart_active.png"
      },
      {
        "pagePath": "pages/user/user",
        "text": "我的",
        "iconPath": "images/tabbar/user.png",
        "selectedIconPath": "images/tabbar/user_active.png"
      }
    ]
  }
}

三、分包的理解

分包是指将小程序的代码和资源分成多个包，然后在小程序中按需加载这些包。分包可以减小程序的体积，提高小程序的加载速度。

在微信小程序中，分包需要在 app.json 文件中配置。分包的配置非常简单，只需要在 app.json 文件中添加如下代码即可：

{
  "subPackages": [
    {
      "root": "pages/a",
      "pages": [
        "page1",
        "page2"
      ]
    },
    {
      "root": "pages/b",
      "pages": [
        "page3",
        "page4"
      ]
    }
  ]
}