小程序准备工作

目录

工程目录

创建页面步骤

小程序配置

tabbar

---

 

优点：
1.小程序单包最大容量只有2M，不需要下载，即用即走
2.入门门槛较低，开发容易；  html，js，css基础，vue react 

缺点：
1. 代码大小偏小，开发有一定的限制，可以使用分包，将项目变成20M；
2. 不能即时发布； 需要微信团队进行审核；  1-7个工作日；

工程目录

app.js 小程序逻辑入口文件（实例化小程序应用）
    App({})  //
app.json 小程序全局配置文件  
app.wxss  .wxss==css  全局样式
project.config.json              项目配置文件  ：不需要手动修改
project.private.config.json     项目配置文件：不需要手动修改
sitemap.json                    类似于网页的robots.txt的这个文件。是否允许微信内搜索到你的小程序。
    具体的可以参考这个链接   
    https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html
- pages 默认存放页面的目录
    默认情况下我们建议以文件夹来区分页面
    例如1：登录页
    - login
        login.js
        login.wxml
        login.wxss
        login.json
    - cart
        cart.js
        cart.wxml
        cart.wxss
        cart.json
    

创建页面步骤

购物车、类别、我的

第1种方式：先在pages下创建一个页面文件夹，在此新建的这个文件夹上再右键=》新建page （名字和文件名建议保持一致）

第2种方式：打开app.json，复制pages数组中的一项出来，然后修改名称即可。

---

小程序配置

全局配置 | 微信开放文档

全局配置app.json

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

pages

必须写在全局配置文件中。定义路由的。

用于指定小程序由哪些页面组成，每一项都对应一个页面的 路径（含文件名） 信息。文件名不需要写文件后缀，框架会自动去寻找对应位置的 .json, .js, .wxml, .wxss 四个文件进行处理。

未指定 entryPagePath 时，数组的第一项代表小程序的初始页面（首页）。

小程序中新增/减少页面，都需要对 pages 数组进行修改。

tabbar

如果设置了tabBar，那么tabBar必须要有list属性，来配置按钮的，里面至少要有2个按钮至多5个

"tabBar": { 
    "selectedColor": "#f00", 激活时的颜色
    "color": "#ccc", 默认颜色
    "list": [ 如果设置了tabBar，那么tabBar必须要有list属性，来配置按钮的，里面至少要有2个按钮至多5个
        {
          "pagePath": "pagePath", 页面路径
          "text": "text",  文字
          "iconPath": "iconPath",  默认图标
          "selectedIconPath": "selectedIconPath" 被选中时的图标
        }，
        {
          "pagePath": "pagePath",
          "text": "text",
          "iconPath": "iconPath",
          "selectedIconPath": "selectedIconPath"
        }
    ]
  }